前篇文章介紹了小程序的MVC結構:
page.js 即控制層(C),也叫業(yè)務邏輯層;
page.js 中的data屬性,即數(shù)據(jù)模型層(M);
page.wxml 即展現(xiàn)層(V);
page.wxss 即css,增強展現(xiàn)層效果。
通過業(yè)務邏輯層(C),修改data屬性(M),從而在展現(xiàn)層(V)中展示。
即MVC設計模式。
一、數(shù)據(jù)綁定
首先看一下Page頁面的MVC 流程結構圖
如果在 data 中定義了某個變量,比如
- Page({
- data:{
- title: '小程序實戰(zhàn)教程',
- desc: '視圖層—WXML'
- }
- })
在頁面中通過 {{title}},即可展示效果,如下動圖:
二、數(shù)據(jù)綁定常用語法
2.1,內(nèi)容
2.2,組件屬性(需要在雙引號之內(nèi))
和內(nèi)容一樣
2.3,控制屬性
2.4,關鍵字(需要{{ }}內(nèi))
true:boolean 類型的 true,代表真值。
false: boolean 類型的 false,代表假值。
注意:不要直接寫 checked="false",其計算結果是一個字符串,轉成 boolean 類型后代表真值。
2.5,三元運算
2.6,算數(shù)運算
2.7,字符串運算