微信小程序的界面程序支持html語法，多加了一部分標(biāo)簽，如view、block、templete等。

模版渲染
index.wxml

<view> <p>{{helloWord}}</p></view>

其中{{}}里面包含的內(nèi)容你可以理解為一個變量，怎么讓程序解析出{{helloWord}}變量

在index.js 中注冊這個變量

var json = { data:{  "helloWord" : "hello world" }};page(json)

然后我們運行小程序，就可以發(fā)現(xiàn)顯示的就是hello world，即所有的變量都需要包含在注冊界面的data中
有的人可能會問，怎么去動態(tài)的添加這些變量呢？

var json = { data:{  "helloWorld":"" }, //監(jiān)聽頁面加載 onLoad:function(){  var that = this;  that.setData({   "helloWorld":"hello world"  }) }};page(json)

甚至我們還可以

var json = { data:{}, //監(jiān)聽頁面加載 onLoad:function(){  var that = this;  that.setData({   "helloWorld":"hello world"  }) }};page(json)

都能實現(xiàn)相同效果，每次調(diào)用setData()函數(shù)的是夠都會重新渲染一次頁面。

index1.wxml

<view> <view wx:for="{{users}}" wx:for-item="{{item}}">  <view wx:for="{{item}}" wx:for-index="{{key}}" wx:for-item="{{val}}">    <p>{{key}}=>{{val}}</p>  </view> </view> <view id="nameDemo">  <p>name : {{users[0].name}}</p> </view> <view>  <button bindtap="clickFunc">我是測試按鈕</button> </view></view>

index1.js

var json={ data:{}, //監(jiān)聽頁面顯示 onShow:function(){  vat that = this;  that.setData({   users:[    {     "name":"name1",     "age":100    },    {     "name":"name2",     "age":101    }   ]  }); }};page(json);

其中變量that的作用是對this的作用域的一個擴展。
wx:for 循環(huán)一個變量
wx:for-index 代表循環(huán)的鍵名
wx:for-item 代表循環(huán)的鍵值
users 在頁面顯示的時候動態(tài)的添加到了data作用域中。

現(xiàn)在我們再來看一個新的問題 如上id=”nameDemo” view中{{users[0].name}} 這個值我們怎么去動態(tài)的更改問題
有的可能說直接重新生成一個json直接渲染進去不就行了？
這種方案是可以的，但是要考慮到渲染的性能呀，如果每次調(diào)用都重新渲染一次，卡死你。
解決方案就是js的小技巧

只更改{{users[0].name}}的值

var json = { data:{}, //監(jiān)聽頁面顯示 onShow:function(){  vat that = this;  that.setData({   users:[    {     "name":"name1",     "age":100    },    {     "name":"name2",     "age":101    }   ]  }); }, clickFunc:function(event){  vat that = this;  var dataJson = {};  dataJson["users[0].name"] = "我是誰";   that.setData(dataJson); }}