WXML模版語法

一、數(shù)據(jù)綁定

1、數(shù)據(jù)綁定的基本原則

（1）在data中定義數(shù)據(jù)

（2）在WXML中使用數(shù)據(jù)

2、在data中定義頁面的數(shù)據(jù)

3、Mustache語法的格式（雙大括號）

4、Mustache語法的應(yīng)用場景

（1）綁定內(nèi)容

（2）綁定屬性

（3）運(yùn)算（三元運(yùn)算、算術(shù)運(yùn)算等）

5、動態(tài)綁定內(nèi)容

6、動態(tài)綁定屬性

7、三元運(yùn)算

8、算術(shù)運(yùn)算

二、WXML模版語法-事件綁定

1、小程序中常用的事件

2、事件對象的屬性列表

3、target和currentTarget的區(qū)別

4、bindtap 的語法格式 （相當(dāng)于鼠標(biāo)點(diǎn)擊事件）

5、在時間處理函數(shù)為data中的數(shù)據(jù)賦值

通過調(diào)用this.setData(dataObject)方法，可以給頁面data中的數(shù)據(jù)重新賦值

6、事件傳參

小程序中的事件傳參比較特殊，不能在綁定事件的同時為事件處理函數(shù)傳遞參數(shù)

7、事件傳參（正確）

可以為組件提供data-*自定義屬性傳參，其中*代表的是傳參的名字

info會被解析為參數(shù)的名

數(shù)值2會被解析為參數(shù)的值

7、事件傳參

在事件處理函數(shù)中，通過event.target.dataset.參數(shù)名，即可獲取到具體參數(shù)的值

8、bindinput的語法格式

9、實(shí)現(xiàn)文本框和data之間的數(shù)據(jù)同步

實(shí)現(xiàn)步驟：

（1）渲染數(shù)據(jù)

（2）渲染結(jié)構(gòu)

（3）美化樣式

（4）綁定input事件處理函數(shù)

三、條件渲染

1、wx:if

2、結(jié)合<block>使用wx:if

如果要一次性控制多個組件的展示和隱藏，可以使用一個<block></block>標(biāo)簽將多個組件包裝并在<block>標(biāo)簽上使用wx:if控制屬性

注意：<block>并不是一個組件，只是一個包裹性質(zhì)的容器，不會在頁面中做任何渲染

3、hidden

直接使用也能控制元素的顯示與隱藏

4、wx:if與hidden的對比

（1）運(yùn)行方式不同

wx:if以動態(tài)創(chuàng)建和移除元素的方式，控制元素的展示與隱藏

hidden以切換樣式的方式（display:none/block），控制元素的顯示與隱藏