小程序模板语法

1.数据绑定

在 **.js 的 data 中定义数据，然后在对应的 **.wxml 页面中使用即可

js 文件中

Page({
  data: {
    msg:'不想说什么了，呵呵'
  }
})

wxml 文件中

<view>{{msg}}</view>

2.列表渲染

和上面类似，改成用数组来定义数据

js 文件中

Page({
  data: {
    list:['小明小时候很爱小红','小红也喜欢小明','小明辜负了小红','小红成了别人的女朋友']
  }
})

wxml 文件中

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

3.条件渲染

和上面类似，根据布尔值来决定是否渲染

js 文件中

Page({
  data: {
    isShow:false
  }
})

wxml 文件中

<view wx:if="{{isShow}}">保持愚蠢</view>

4.事件

注意
（1）mytap 函数的定义不是在data中,而是与data平行
（2）this.setData 改变的是data中的数据，不是直接改css样式

js 文件中

Page({
  data: {
    bcolor:'#aef'
  },
  mytap: function () {
    this.setData({bcolor:'#87a'})
  }
})

wxml 文件中

<view bindtap="mytap" style='background:{{bcolor}};height:90rpx;'></view>