微信小程序_结构框架

结构框架

MINA（Miniapp Is Not App)框架中，两个层次：视图层、逻辑层。

页面管理

路由方式	触发时机	路由前页面	路由后页面
初始化	小程序打开第一个页面		onLoad，onShow
打开新页面	API wx.navigateTo,或"<navigator open-type=“navigateTo”">	onHide	onLoad，onShow
页面重定向	API wx.redirectTo,或"<navigator open-type=“redirectTo”"	onUnload	onLoad,onShow
页面返回	API wx.navigateBack,或"<navigator open-type=“navigateBack”"	onUnload	onShow
Tab切换	API wx.switchTab,或"<navigator open-type=“switchTab”"
重启动	API wx.reLaunch,或"<navigator open-type=“reLaunch”"	onUnland	onLoad,onShow

配置文件

app.json

1. pages
   接收一个数组，指定页面。

"pages":[
    "pages/index/index",
    "pages/logs/logs"
  ]

2.window
设置状态栏、导航条、标题、窗口背景色。

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

• navigationBarBackgroundColor背景色
• "backgroundTextStyle"标题色
• "navigationBarTitleText"标题文字

3.tabBar
是一个数组，配置底部或顶部tab栏

"tabBar": {
    "list": [{
      "pagePath": "pagePath",
      "text": "text",
      "iconPath": "iconPath",
      "selectedIconPath": "selectedIconPath"
    }]
  }

list属性

• pagePath 页面路径
• text tab上按钮文字
• iconPath 图片路径
• selectedColorPath 选中时图片路径

4.networdTimeout
设置各种网络请求的超时时间

5.debug
开启debug模式，“true”

6.页面配置

视图层

WXML

• 数据绑定
• 列表渲染
• 条件渲染
• 模板
• 事件等

WXSS

类同css