微信小程式(學習二) -- setData(頁面資料重新整理)
阿新 • • 發佈:2019-01-03
微信小程式提供了將資料從邏輯層傳送到資料層的函式setData。
Page.prototype.setData() | setData | 用於將資料從邏輯層傳送到檢視層,同時改變對應的 this.data 的值。接受一個物件,以 key,value 的形式表示將 this.data 中的 key 對應的值改變成 value。 |
---|
首先要注意的是:
1、直接修改 this.data 而不呼叫 this.setData 是無法改變頁面的狀態的,還會造成資料不一致
2、單次設定的資料不能超過1024kB,請儘量避免一次設定過多的資料。
3、不能很頻繁的呼叫this.setData,例如自己註冊一個update函式,每幀呼叫一次this.setData,可能造成應用卡頓
下面給出一個示例,並在後面講解這個示例。
<!--pages/test.wxml-->
<text>{{count}}</text>
<button bindtap='clickCount' data-msg='click'>點選計數</button>
// pages/test.js
Page({
/**
* 頁面的初始資料
*/
data: {
count: 0,
},
/**
* 計數
*/
clickCount(options) {
console.log(options);
this .setData({
count: this.data.count + 1
});
}
})
每次更改count值,就可以在頁面刷新出來了。簡單容易理解。
我們在點選的時候呼叫了clickCount(options)函式,並且將options打印出來了,如果我們要給clickCount傳遞引數怎麼辦呢,可以這樣使用:
<button bindtap='clickCount' data-msg='click'>點選計數</button>
data-(你想傳遞的引數型別)=”引數”,微信會幫你封裝資料,將你點選資訊,頁面的一些資訊傳遞到邏輯段,看下圖。
msg引數在Target中
使用方式:
let count = options.target.dataset.msg;
資料的使用就到這裡了。