1. for 循环

for循环实现页面文字内容渲染，并绑定点击事件，点击后文字变色。

<!-- wxml页-->
<!-- wx:for="{{数组}}" 循环需要绑定key wx:key="index"-->
<!-- 自带定义 item 表示数组的每一项 index 表示数组的索引 -->
<!-- 使用wx:for-item修改每一项值的key -->
<!-- 使用wx:for-index修改每一项值的index -->
<view wx:for="{{list}}" wx:key="i" wx:for-item="r" wx:for-index="i" 
style="color:{{r.styFlag?'red':''}};" data-i="{{i}}" bindtap="choose">
    {{r.name}}--{{i}}
</view>

    //js页
    data: {
        list:[{
            name:'冰墩墩',
            styFlag:true
        },{
            name:'雪融融',
            styFlag:false
        },{
            name:'小泡菜',
            styFlag:false
        }]
    },
    choose:function(e){
        let { currentTarget:{ dataset:{i} } } = e;
        /* 第一步获取点击的当前的内容的索引 */
        /* 排他 把所有的先置空 */
        this.data.list.forEach(r=>{
            r.styFlag = false
        })
        this.data.list[i].styFlag = true;
        /* 数据变了 视图没变 必须要使用setData实现数据和视图的双向数据绑定 */
        this.setData({
            list:this.data.list
        })
    }
复制代码

2. if 判断

通过if条件判断，改变文字。

<!-- wxml页-->
<view>
<text wx:if="{{flag}}">我是冰墩墩</text>
<text wx:else>我是雪容融</text>
<button catchtap="change">切换</button>
</view>

  //js页
  data: {
    flag: true
  },
  change: function () {
    this.setData({ flag: !this.data.flag })
  }
复制代码

3. 页面跳转

（1）tabBar

//app.json页面（json页面无法注释，否则报错）
"tabBar": {
    "color": "#fff",
    "selectedColor": "#FF1800",
    "backgroundColor": "#000",
    "list": [
      {
        "pagePath": "pages/index/index",
        "text": "首页",
        "iconPath": "",
        "selectedIconPath": ""
      },
      {
        "pagePath": "pages/logs/logs",
        "text": "日志",
        "iconPath": "",
        "selectedIconPath": ""
      }
    ]
  }
复制代码

（2）路由

wx.switchTab

跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面。

wx.switchTab({
  url: ''
})
复制代码

wx.reLaunch

关闭所有页面，打开到应用内的某个页面。

wx.reLaunch({
  url: ''
})
复制代码

wx.redirectTo

关闭当前页面，跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。

wx.redirectTo({
  url: ''
})
复制代码

wx.navigateTo

保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabbar 页面。

wx.navigateTo({
  url: ''
})
复制代码

wx.navigateBack

关闭当前页面，返回上一页面或多级页面。

wx.navigateBack()