Page

Page() 函數(shù)用來(lái)注冊(cè)一個(gè)頁(yè)面。接受一個(gè) object 參數(shù)，其指定頁(yè)面的初始數(shù)據(jù)、生命周期函數(shù)、事件處理函數(shù)等。

object 參數(shù)說(shuō)明：

屬性類(lèi)型描述dataObject頁(yè)面的初始數(shù)據(jù)onLoadFunction生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面加載onReadyFunction生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面初次渲染完成onShowFunction生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面顯示onHideFunction生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面隱藏onUnloadFunction生命周期函數(shù)--監(jiān)聽(tīng)頁(yè)面卸載onPullDownRefreshFunction頁(yè)面相關(guān)事件處理函數(shù)--監(jiān)聽(tīng)用戶(hù)下拉動(dòng)作onReachBottomFunction頁(yè)面上拉觸底事件的處理函數(shù)onShareAppMessageFunction用戶(hù)點(diǎn)擊右上角轉(zhuǎn)發(fā)onPageScrollFunction頁(yè)面滾動(dòng)觸發(fā)事件的處理函數(shù)onTabItemTapFunction當(dāng)前是 tab 頁(yè)時(shí)，點(diǎn)擊 tab 時(shí)觸發(fā)其他Any開(kāi)發(fā)者可以添加任意的函數(shù)或數(shù)據(jù)到 object 參數(shù)中，在頁(yè)面的函數(shù)中用 this 可以訪問(wèn)

object 內(nèi)容在頁(yè)面加載時(shí)會(huì)進(jìn)行一次深拷貝，需考慮數(shù)據(jù)大小對(duì)頁(yè)面加載的開(kāi)銷(xiāo)

示例代碼：

//index.jsPage({  data: {    text: "This is page data."  },  onLoad: function(options) {    // Do some initialize when page load.  },  onReady: function() {    // Do something when page ready.  },  onShow: function() {    // Do something when page show.  },  onHide: function() {    // Do something when page hide.  },  onUnload: function() {    // Do something when page close.  },  onPullDownRefresh: function() {    // Do something when pull down.  },  onReachBottom: function() {    // Do something when page reach bottom.  },  onShareAppMessage: function () {   // return custom share data when user share.  },  onPageScroll: function() {    // Do something when page scroll  },  onTabItemTap(item) {    console.log(item.index)    console.log(item.pagePath)    console.log(item.text)  },  // Event handler.  viewTap: function() {    this.setData({      text: 'Set some data for updating view.'    }, function() {      // this is setData callback    })  },  customData: {    hi: 'MINA'  }})初始化數(shù)據(jù)

初始化數(shù)據(jù)將作為頁(yè)面的第一次渲染。data 將會(huì)以 JSON 的形式由邏輯層傳至渲染層，所以其數(shù)據(jù)必須是可以轉(zhuǎn)成 JSON 的格式：字符串，數(shù)字，布爾值，對(duì)象，數(shù)組。

渲染層可以通過(guò) WXML 對(duì)數(shù)據(jù)進(jìn)行綁定。

示例代碼：

<view>{{text}}</view><view>{{array[0].msg}}</view>Page({  data: {    text: 'init data',    array: [{msg: '1'}, {msg: '2'}]  }})生命周期函數(shù)

onLoad: 頁(yè)面加載

一個(gè)頁(yè)面只會(huì)調(diào)用一次，可以在 onLoad 中獲取打開(kāi)當(dāng)前頁(yè)面所調(diào)用的 query 參數(shù)。

onShow: 頁(yè)面顯示

每次打開(kāi)頁(yè)面都會(huì)調(diào)用一次。

onReady: 頁(yè)面初次渲染完成

一個(gè)頁(yè)面只會(huì)調(diào)用一次，代表頁(yè)面已經(jīng)準(zhǔn)備妥當(dāng)，可以和視圖層進(jìn)行交互。

對(duì)界面的設(shè)置如wx.setNavigationBarTitle請(qǐng)?jiān)趏nReady之后設(shè)置。詳見(jiàn)生命周期

onHide: 頁(yè)面隱藏

當(dāng)navigateTo或底部tab切換時(shí)調(diào)用。

onUnload: 頁(yè)面卸載

當(dāng)redirectTo或navigateBack的時(shí)候調(diào)用。

生命周期的調(diào)用以及頁(yè)面的路由方式詳見(jiàn)

onLoad參數(shù)

類(lèi)型說(shuō)明Object其他頁(yè)面打開(kāi)當(dāng)前頁(yè)面所調(diào)用的 query 參數(shù)頁(yè)面相關(guān)事件處理函數(shù)

onPullDownRefresh: 下拉刷新

監(jiān)聽(tīng)用戶(hù)下拉刷新事件。

需要在app.json的window選項(xiàng)中或頁(yè)面配置中開(kāi)啟enablePullDownRefresh。

當(dāng)處理完數(shù)據(jù)刷新后，wx.stopPullDownRefresh可以停止當(dāng)前頁(yè)面的下拉刷新。

onReachBottom: 上拉觸底

監(jiān)聽(tīng)用戶(hù)上拉觸底事件。

可以在app.json的window選項(xiàng)中或頁(yè)面配置中設(shè)置觸發(fā)距離onReachBottomDistance。

在觸發(fā)距離內(nèi)滑動(dòng)期間，本事件只會(huì)被觸發(fā)一次。

onPageScroll: 頁(yè)面滾動(dòng)

監(jiān)聽(tīng)用戶(hù)滑動(dòng)頁(yè)面事件。

參數(shù)為 Object，包含以下字段：

字段類(lèi)型說(shuō)明scrollTopNumber頁(yè)面在垂直方向已滾動(dòng)的距離（單位px）

onShareAppMessage: 用戶(hù)轉(zhuǎn)發(fā)

只有定義了此事件處理函數(shù)，右上角菜單才會(huì)顯示“轉(zhuǎn)發(fā)”按鈕

用戶(hù)點(diǎn)擊轉(zhuǎn)發(fā)按鈕的時(shí)候會(huì)調(diào)用

此事件需要 return 一個(gè) Object，用于自定義轉(zhuǎn)發(fā)內(nèi)容

自定義轉(zhuǎn)發(fā)字段

字段說(shuō)明默認(rèn)值title轉(zhuǎn)發(fā)標(biāo)題當(dāng)前小程序名稱(chēng)path轉(zhuǎn)發(fā)路徑當(dāng)前頁(yè)面 path ，必須是以 / 開(kāi)頭的完整路徑

示例代碼

Page({  onShareAppMessage: function () {    return {      title: '自定義轉(zhuǎn)發(fā)標(biāo)題',      path: '/page/user?id=123'    }  }})事件處理函數(shù)

除了初始化數(shù)據(jù)和生命周期函數(shù)，Page 中還可以定義一些特殊的函數(shù)：事件處理函數(shù)。在渲染層可以在組件中加入事件綁定，當(dāng)達(dá)到觸發(fā)事件時(shí)，就會(huì)執(zhí)行 Page 中定義的事件處理函數(shù)。

示例代碼：

<view bindtap="viewTap"> click me </view>Page({  viewTap: function() {    console.log('view tap')  }})Page.prototype.route

基礎(chǔ)庫(kù) 1.2.0 開(kāi)始支持，低版本需做兼容處理

route 字段可以獲取到當(dāng)前頁(yè)面的路徑。

Page.prototype.setData()

setData 函數(shù)用于將數(shù)據(jù)從邏輯層發(fā)送到視圖層（異步），同時(shí)改變對(duì)應(yīng)的 this.data 的值（同步）。
setData() 參數(shù)格式字段類(lèi)型必填描述最低版本dataObject是這次要改變的數(shù)據(jù)

callbackFunction否回調(diào)函數(shù)1.5.0

object 以 key，value 的形式表示將 this.data 中的 key 對(duì)應(yīng)的值改變成 value。 callback 是一個(gè)回調(diào)函數(shù)，在這次setData對(duì)界面渲染完畢后調(diào)用。

當(dāng)前名稱(chēng)：小程序頁(yè)面注冊(cè)Page() 函數(shù)
URL地址：http://www.rwnh.cn/news29/181929.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供App設(shè)計(jì)、建站公司、網(wǎng)站導(dǎo)航、小程序開(kāi)發(fā)、搜索引擎優(yōu)化、企業(yè)建站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)