- 企業數字化轉型：釘釘小程序開發權威指南
- 楊鶴等
- 557字
- 2022-05-05 21:37:51
4.4.1 注冊小程序頁面
1.Page
Page方法接收一個Object作為參數，該參數用來指定頁面的初始數據、生命周期方法、事件處理函數等。
示例代碼：
在上述代碼中，Page方法的參數列表如表4-7所示。
表4-7 Page方法的參數列表
續表
（1）頁面初始數據data。
data是頁面第一次渲染時使用的初始數據。
注意
當data作為對象時，如果在頁面中修改data，則會影響該頁面的不同實例。
.axml示例代碼：
.js示例代碼：
（2）生命周期方法及其說明如表4-8所示。
表4-8 生命周期方法及其說明
（3）事件處理函數及其說明如表4-9所示。
表4-9 事件處理函數及其說明
2.Page.prototype.setData
setData方法用于將數據從邏輯層發送到視圖層，同時改變對應的this.data的值。
setData方法接收一個對象作為參數。對象的鍵名key可以非常靈活，以數據路徑的形式給出，如array[2].message、a.b.c.d，并且不需要在this.data中預先定義。
注意
● 直接修改this.data無效，無法改變頁面的狀態，還會造成數據不一致。
● 盡量避免一次性設置過多的數據。
示例代碼：
3.Page.prototype.$spliceData
$spliceData同樣用于將數據從邏輯層發送到視圖層，但是相比setData，在處理長列表時，其具有更高的性能。$spliceData接收一個對象作為參數。
● 對象的鍵名key可以非常靈活，以數據路徑的形式給出，如array[2].message、a.b.c.d，并且不需要在this.data中預先定義。
● 對象的value為一個數組（格式為[start，deleteCount，...items]），數組的第一個元素為操作的起始位置，第二個元素為刪除的元素的個數，剩余的元素均為插入的數據，對應ES5中數組的splice方法。
.axml示例代碼：
.js示例代碼：
頁面輸出：
