數(shù)據(jù)綁定作為,邏輯與界面分離的框架當(dāng)中,是一種不可或缺的部分,
它的作用是,將邏輯層進過業(yè)務(wù)邏輯得到的數(shù)據(jù)呈現(xiàn)到界面上。小程序中跟這個基本一樣,那有何不同呢,一起來看看。
小程序中規(guī)定數(shù)據(jù)必須要放在一個固定的地方,就是該頁面邏輯層的 data 屬性中。
頁面的邏輯層就是該頁面的 js 中,data:{ //該對象中的所有屬性都可以在界面中訪問到。 }
語法:mustache 小胡子語法 邏輯判斷、三元表達式都可運算
1.小胡子語法 作用于元素的內(nèi)容
邏輯層:
界面:
PS:在界面訪問數(shù)據(jù)時,不用 data. 這種形勢,只需訪問data中的屬性名。如上面,直接訪問 message
小胡子語法,作用: 專門用于輸出邏輯層暴露的數(shù)據(jù)
2.小胡子語法作用于,元素的屬性上
mustache 之外還可以添加?xùn)|西
3.簡單的邏輯運算
4.字符串拼接
1.只是字符串
2.小胡子語法 mustache {{}} 可以用于申明有類型的值
默認選中屬性為 false,可以通過點擊選中和不選。
<checkbox checked='true'></checkbox> = 選中
<checkbox checked='checked'></checkbox> = 選中
<checkbox checked></checkbox> = 選中
ps:雖然可以實現(xiàn)效果,但是要排除掉。因為小程序的 wxml 語法要遵循 html 語法,
html 規(guī)定,屬性必須要有屬性值,而且屬性值要用雙引號引起來。
因此,這個方法也兼容,但是并不推薦這么去做。
<checkbox checked='asdf'></checkbox> = 選中 (隨便寫)
<checkbox checked=' '></checkbox> = 選中 (為空)
發(fā)現(xiàn):隨便寫checked='asdf',或者,checked=' ' 為空,也是可以被選中的。
所以,在小程序 wxml 中 屬性的值 如果只是在雙引號內(nèi)部,就永遠是字符串。因此,要想有自己的類型,就要借助‘小胡子語法’。
例如:{{message + 2}}
message 為該頁面 js 中定義的數(shù)據(jù)。
message是字符串時,上面的輸出為 ‘拼接的字符串’
message是數(shù)字1時,上面的輸出結(jié)果為 ‘拼接的字符串’
所以,mustache語法,用于申明有類型的值
首先,看一下
js中暴露一個函數(shù):
界面:
結(jié)論:沒有任何效果顯示在界面中。因此,data 中只能暴露數(shù)據(jù)成員。
那么,要怎么才能在界面調(diào)用邏輯層暴露的函數(shù)呢,小程序有一個 wxs 。
wxs 標(biāo)簽類似于,在 html 中的 script 標(biāo)簽,可以定義一些行內(nèi)腳本。
工作日 8:30-12:00 14:30-18:00
周六及部分節(jié)假日提供值班服務(wù)