微信小程序学习笔记【一】

编辑器结构：

MINI——框架

1.pages【index——首页页面文件 loges——日志页面文件】

js——页面逻辑
wxml——页面结构
json ——页面配置
wxss ——页面样式表

2.utils 不必要，可自行删除
3.文件
app.js——小程序入口文件，同时也为全局文件，不可删除
app.json——全局配置文件，针对整个项目进行配置（可用page项目进行单页面配置）
app.wxss——全局样式文件，默认
project.config.json——“详情”页面，供手动配置
sitemap.json——配置该小程序或页面是否能在微信内被搜索到

字段：

1.全局配置【app.json】：全部页面的样式设置
https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html

"pages": [
    "pages/index/页面名1",
    "pages/logs/页面名2"
    ……
  ],

和pages中的.js页面对应（*不能在页面名后加后缀名）
默认打开页面为pages字段第一行中的页面

"window": {
   
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "WeChat",
    "navigationBarTextStyle": "black"
  },

定义所有页面各部分的外观，包括颜色、文字等

avigationBarBackgroundColor——标题栏背景色
navigationBarTitleText——标题栏文字内容
navigationBarTextStyle——标题栏文字颜色，只可为“black”或“white”
enablePullDownRefresh——全局下拉刷新，只可为“true”或“false”（*不加“”）
backgroundTextStyle——下拉刷新小圆点颜色，只可为“dark”或“light”
backgroundColor——下拉刷新小圆点所在区域背景色
详见： https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html#window

"tabBar": {
   
    "list": [{
   
      "pagePath": "pages中的地址",
      "text": "名称",
      "iconPath": "未选中图标路径",
      "selectedIconPath": "选中图标路径"
    }]
  },

页面下方菜单设置，如淘宝app下方的“首页”“购物车”等

list（*至少包含两项）：
pagePath——跳转后页面
text——显示文字
添加图标：将选中和未选中图标放入文件夹，文件夹放入项目文件夹（文件夹和pages同层）。在iconPath等添加路径，“文件夹名/图片名.后缀名”
详见：https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html#tabBar

2.页面配置【页面名.json】：单独页面的样式配置
https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/page.html

3.sitemap 配置【sitemap.json】：小程序或页面是否能在微信内被搜索到
https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/sitemap.html

页面生命周期：https://developers.weixin.qq.com/miniprogram/dev/reference/api/Page.html

模板语法：

1.数据绑定