【微信小程序】视图层-数据绑定（算数运算，逻辑判断，数据路径运算等等）

实现的效果



<!--index.wxml：布局摆放-->

<view class="container">

  <!--演示1：简单的数据绑定-->

  <view>{{message}}</view>

  <!--演示2：绑定数组：array 从index.js里面的data.array 里面的取数组数据-->

  <view wx:for="{{array}}">演示2：绑定数组 {{item}}</view>

   

  <!--演示3：if，else if条件-->

  <view wx:if="{{view=='WEBVIEW'}}">演示3：WEBVIEW</view>

  <view wx:elif="{{view=='app'}}">演示3：app</view>

  <view wx:else="{{view=='MINA'}}">演示3：MINA</view>

   

  <!--演示4：算数运算-->

  <view>演示4：{{a + b}} + {{c}} + d </view>

 <!--演示5：逻辑判断-->

  <view wx:if="{{length > 5}}">演示5：逻辑判断：大于5 </view>

 <!--演示6：数据路径运算-->

  <view>{{object.key}} {{arraytest[0]}}</view>

</view>

//index.js：代码演示

var param={

  data:

  {

      message:'演示1：简单的数据绑定:微信小程序测试',

      array:[1,2,3,4,'hello','weixin'],//'演示2：绑定数组：'

      view:'app',//演示3：IF,ELIF,ELSE条件的调用

      a: 1,//演示4：算数运算,传递A值

      b: 2,//演示4：算数运算，传递B值

      c: 3,//演示4：算数运算。传递C值

      length:6,//演示5：传递值length，用来判断length是否大于5

      object:{key:'hello5'},

      arraytest:['mina5']

  }

};

Page(param);