这一章涉及了一点我们实践课团队设计的东西嘻嘻

整个程序涉及的页面都会在app.json中的pages框下进行标明。编译后会在对应文件夹下生成对应文件。

1. 导航栏

所有页面都有导航栏=>在app.json中设置。

window中是关于页面的设置。比如navigator_tabBar(之类的名字)就是最顶上的栏目显示的文本和栏目背景颜色。

tabBar中是关于导航栏的设置。color:字未选中时的颜色，对应就是选中的颜色。每个小图标用list框起来，里面定义图标，图标的字，图标选中后的变化，关联的页面等。

{"pages":["pages/index/index","pages/logs/logs","pages/questions/questions","pages/share/share","pages/me/me"],"window":{"backgroundTextStyle":"light","navigationBarBackgroundColor": "#FF0000","navigationBarTitleText": "例子","navigationBarTextStyle":"white"},"tabBar": {"color": "#666666","selectedColor":"#FF0000","list":[{"pagePath": "pages/index/index","text": "首页","iconPath": "pages/image/page.png","selectedIconPath": "pages/image/page_select.png"},{"pagePath": "pages/questions/questions","text": "提问区","iconPath": "pages/image/questions.png","selectedIconPath": "pages/image/questions_select.png"},{"pagePath": "pages/share/share","text": "分享区","iconPath": "pages/image/share.png","selectedIconPath": "pages/image/share_select.png"},{"pagePath": "pages/me/me","text": "我的","iconPath": "pages/image/me.png","selectedIconPath": "pages/image/me_select.png"}]},"style": "v2","sitemapLocation": "sitemap.json"
}

另外，对于每个页面，可以在其.json文件中修改window内容。将直接覆盖掉app.json的内容。

2. 数据和事件绑定

之前已经实践过。

数据绑定在wxml页面用{{}}，在js页面定义于data：中。需要修改时在js页面用this.setData({})进行修改。

事件绑定可以用在onLoad(页面加载时)，也可以用于按钮，输入框等，用bindtap,bindblur,bindinput等进行绑定，事件函数位于js文件。

数据和事件绑定学生姓名：{{name1}}总分：{{ch_s}}+{{ma_s}}={{s}}点击更换数据

3. 函数调用

js文件自动会添加const app=getAPP()，表示允许引用全局函数=>即app.js中的函数

声明的函数只在该文件中有效，设置为全局需要用module.exports={}，引用其它文件的函数或数值需要require。

4. 条件渲染

说到底就是wx:if函数，掌握就好了！

当参数为{{color}}时显示{color=='blue'}}">blue{color=='red'}}">red{color=='green'}}">green其它颜色    {color}};">1{color=='blue'||color=='red'||color=='green'}}">12