微信小程序 --- for循环渲染

循环标签：wx:for

<view wx:for="{{['aa','bb','cc']}}">
{{index}} {{item}}
</view>

这里的 index 和 item是微信默认的，可以自定义：

<view wx:for="{{['aa','bb','cc']}}" wx:for-index="a" wx:for-item="x">
{{a}} {{x}}
</view>

可以这样玩：点击删除

<view wx:for="{{color}}">
{{index}}:{{item}}
</view>

page.js文件

//获取应用实例
const app = getApp()
Page({
  data: {
    text: "点击",
    onOff: false,
    color: ['red','orange','yellow']
  },
  btnclick:function(){
      var onOff = this.data.onOff;
      var color = this.data.color;
      color.shift();
      this.setData({text:"新内容",onOff:!onOff,color:color});
  }
})