數據綁定：
view標籤和text標籤
在wxml裏可以寫入view標籤和text標籤
text標籤相當於html裏的span標籤，是行內元素，寫入時，不會進行換行
view標籤相當於html裏的div標籤，是塊級元素，寫入時，會導致換行
<!--pages/demo03/demo03.wxml-->
<text>1</text>
<text>2</text>
<view>3</view>
在頁面中插入字符串，數字，bool，object類型的數據：
此時如果直接在wxml的view標籤裏寫入是不管用的。需要在js文件裏寫入數據的屬性。
wxml文件：
<!--pages/demo03/demo03.wxml-->
<view>字符串：{{message}}</view>
<view>數字：{{num}}</view>
<view>布爾值：{{isRight}}</view>
<view>對象：{{Student.name}}</view>
<view>{{Student.ID}}</view>
js文件：
// pages/demo03/demo03.js
Page({
/**
* 頁面的初始數據
*/
data: {
message:"Hello World",
num:20,
isRight:true,
Student:{
name:"鹹魚4號",
ID:2012121,
},
isChecked:false
}
})
數據在標籤的屬性中使用：
<view data-num="{{num}}">自定義屬性</view>
<view>
<checkbox checked="{{isChecked}}"></checkbox>
</view>
同時應該注意的是在代碼：
<checkbox checked="{{isChecked}}"></checkbox>
在雙引號和花括號之間是不能加上空格的
錯誤寫法：
<checkbox checked=" {{isChecked}}"></checkbox>
此時會使複選框的出現選中的狀態。
運算：
在wxml裏的花括號裏可以進行一些運算，例如：數字的加減乘除，字符串的拼接，一些邏輯運算等。
<!--數字運算-->
<view>{{1+1}}</view>
<!--字符串拼接-->
<view>{{'1'+'1'}}</view>
<!--三元運算-->
<view>{{1>2?'false':'true'}}</view>
<!--邏輯判斷-->
<view wx:if="{{3>5}}">1</view>
<view wx:else>2</view>
注意點：和以上是一樣的雙引號和花括號之間是不能有空格的，不然會被解析成字符串
列表渲染：
1、列表循環：wx-for
語法：
wx:for="{{數組或者對象}}"
wx:for-item=“循環項的名稱”
wx:for-index=“循環項的索引”
wx:key=“唯一的值”
項的名稱默認爲：item；wx:for-item可以指定數組當前元素的變量名
下標變量名默認爲：index；wx:for-index可以指定數組當前下標的變量名
wx：key:用來提高數組的渲染的性能，可以保證每一個項的唯一性。綁定的值可以是string類型，也可以是*this類型。若爲string類型，那麼就表示循環項中的唯一屬性；如果是保留字“*this”，它的意思就是item本身即循環項，*this代表的必須是唯一的字符串和數組。例如：[1,2,3],[‘1’,‘2’,‘3’]。
list:[
{
name:"張三",
ID:20121
},
{
name:"李四",
ID:20122
},
{
name:"王五",
ID:20123
}
]
<view>
<view wx:for="{{list}}"
wx:for-item="item"
wx:for-index="index"
wx:key="ID">
索引：{{index}};
姓名：{{item.name}} 學號：{{item.ID}}
</view>
</view>
<view>
<view wx:for="{{Student}}"
wx:for-item="value"
wx:for-index="key"
wx:key="ID">
屬性：{{key}} 值：{{value}}
</view>
</view>
注意點：
（1）在數組出現嵌套循環的時候，應該要注意綁定的名稱不要重名：
wx:for-item=“item” wx:for-index=“index”
（2）一般情況下，不寫：
wx:for-item=“item” wx:for-index=“index”
條件渲染：
可以使用wx：if=“{{istrue}}”來判斷是否需要對代碼塊進行渲染
<view>
<view wx:if="{{3>5}}">1</view>
<view wx:elif="{{3==5}}">2</view>
<view wx:else>3</view>
</view>
hidden：
類似於wx：if
以下的兩種方式都是適用的：
<view >
<view hidden>h1</view>
<view hidden="{{true}}">h2</view>
</view>
在標籤不是頻繁的切換的時候，使用wx：if。因爲它是直接把標籤從頁面結構上給移除掉的。
在標籤頻繁的切換顯示的時候，優先使用hidden。因爲它是通過添加樣式的方式來切換顯示的。（display：none）因爲hidden屬性是和display屬性相關的，所以在使用hidden屬性的時候，不能添加display屬性
舉個例子：
<view hidden style="display:flex">hidden</view>
在這裏雖然寫了hidden，但是還是會在頁面中出現hidden的字段。這是因爲display：flex覆蓋了hidden的屬性：display：none。所以纔會出現字。