小程序WXML语法

一、WXML模块语法---数据绑定

   1、数据绑定的基本原则

       1.在data中定义数据

       2.在WXML中使用数据

    2、在data中定义页面的数据

          在页面对应的.js文件中，把数据定义到data对象中即可：

Page({
   data:{
    // 字符串类型的数据
    info:'init data',
    // 数组类型的数据
    msgList:[{msg:'hello'},{msg:'world'}] 
  }
})

     3、Mustache语法的格式

           把data中的数据绑定到页面中渲染，使用Mustache语法（双大括号）将变量抱起来即可。

<view>{
  {要绑定的数据名称}}</view>

     4、Mustache语法的应用场景

           1.绑定内容

               上面2、3已演示。

           2.动态绑定属性

      页面的数据如下：

Page({
   data:{
      imgSrc:'图片路径'
  }
})

      页面的结构如下:

<image src="{
  {imgSrc}}"></image>
//如果不希望图片变形，可在image后加入mode=""属性

           3.运算（三元运算、算数运算等）

     （三元运算） 页面的数据如下：

Page({
   data:{
     randomNum:Math.random()*10 //生成10以内的随机数
  }
})

      页面的结构如下：

<view>{
  {randomNumber>=5?'随机数大于或等于5':'随机数字小于5'}}</view>
//如果希望查看当前所有数据，可以通过调试器里的AppData查