2022-07-25 分類: 網(wǎng)站建設(shè)
Page
Page() 函數(shù)用來注冊一個(gè)頁面。接受一個(gè) object 參數(shù),其指定頁面的初始數(shù)據(jù)、生命周期函數(shù)、事件處理函數(shù)等。
object 參數(shù)說明:屬性類型描述dataObject頁面的初始數(shù)據(jù)onLoadFunction生命周期函數(shù)--監(jiān)聽頁面加載onReadyFunction生命周期函數(shù)--監(jiān)聽頁面初次渲染完成onShowFunction生命周期函數(shù)--監(jiān)聽頁面顯示onHideFunction生命周期函數(shù)--監(jiān)聽頁面隱藏onUnloadFunction生命周期函數(shù)--監(jiān)聽頁面卸載onPullDownRefreshFunction頁面相關(guān)事件處理函數(shù)--監(jiān)聽用戶下拉動(dòng)作onReachBottomFunction頁面上拉觸底事件的處理函數(shù)onShareAppMessageFunction用戶點(diǎn)擊右上角轉(zhuǎn)發(fā)onPageScrollFunction頁面滾動(dòng)觸發(fā)事件的處理函數(shù)onTabItemTapFunction當(dāng)前是 tab 頁時(shí),點(diǎn)擊 tab 時(shí)觸發(fā)其他Any開發(fā)者可以添加任意的函數(shù)或數(shù)據(jù)到 object 參數(shù)中,在頁面的函數(shù)中用 this 可以訪問
object 內(nèi)容在頁面加載時(shí)會(huì)進(jìn)行一次深拷貝,需考慮數(shù)據(jù)大小對頁面加載的開銷
示例代碼://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ù)將作為頁面的第一次渲染。data 將會(huì)以 JSON 的形式由邏輯層傳至渲染層,所以其數(shù)據(jù)必須是可以轉(zhuǎn)成 JSON 的格式:字符串,數(shù)字,布爾值,對象,數(shù)組。
渲染層可以通過 WXML 對數(shù)據(jù)進(jìn)行綁定。
示例代碼:<view>{{text}}</view><view>{{array[0].msg}}</view>Page({ data: { text: 'init data', array: [{msg: '1'}, {msg: '2'}] }})生命周期函數(shù)
onLoad: 頁面加載
一個(gè)頁面只會(huì)調(diào)用一次,可以在 onLoad 中獲取打開當(dāng)前頁面所調(diào)用的 query 參數(shù)。
onShow: 頁面顯示
每次打開頁面都會(huì)調(diào)用一次。
onReady: 頁面初次渲染完成
一個(gè)頁面只會(huì)調(diào)用一次,代表頁面已經(jīng)準(zhǔn)備妥當(dāng),可以和視圖層進(jìn)行交互。
對界面的設(shè)置如wx.setNavigationBarTitle請?jiān)趏nReady之后設(shè)置。詳見生命周期
onHide: 頁面隱藏
當(dāng)navigateTo或底部tab切換時(shí)調(diào)用。
onUnload: 頁面卸載
當(dāng)redirectTo或navigateBack的時(shí)候調(diào)用。
生命周期的調(diào)用以及頁面的路由方式詳見
onLoad參數(shù)類型說明Object其他頁面打開當(dāng)前頁面所調(diào)用的 query 參數(shù)頁面相關(guān)事件處理函數(shù)
onPullDownRefresh: 下拉刷新
監(jiān)聽用戶下拉刷新事件。
需要在app.json的window選項(xiàng)中或頁面配置中開啟enablePullDownRefresh。
當(dāng)處理完數(shù)據(jù)刷新后,wx.stopPullDownRefresh可以停止當(dāng)前頁面的下拉刷新。
onReachBottom: 上拉觸底
監(jiān)聽用戶上拉觸底事件。
可以在app.json的window選項(xiàng)中或頁面配置中設(shè)置觸發(fā)距離onReachBottomDistance。
在觸發(fā)距離內(nèi)滑動(dòng)期間,本事件只會(huì)被觸發(fā)一次。
onPageScroll: 頁面滾動(dòng)
監(jiān)聽用戶滑動(dòng)頁面事件。
參數(shù)為 Object,包含以下字段:字段類型說明scrollTopNumber頁面在垂直方向已滾動(dòng)的距離(單位px)
onShareAppMessage: 用戶轉(zhuǎn)發(fā)
只有定義了此事件處理函數(shù),右上角菜單才會(huì)顯示“轉(zhuǎn)發(fā)”按鈕
用戶點(diǎn)擊轉(zhuǎn)發(fā)按鈕的時(shí)候會(huì)調(diào)用
此事件需要 return 一個(gè) Object,用于自定義轉(zhuǎn)發(fā)內(nèi)容
自定義轉(zhuǎn)發(fā)字段字段說明默認(rèn)值title轉(zhuǎn)發(fā)標(biāo)題當(dāng)前小程序名稱path轉(zhuǎn)發(fā)路徑當(dāng)前頁面 path ,必須是以 / 開頭的完整路徑
示例代碼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ǔ)庫 1.2.0 開始支持,低版本需做兼容處理
route 字段可以獲取到當(dāng)前頁面的路徑。Page.prototype.setData()
setData 函數(shù)用于將數(shù)據(jù)從邏輯層發(fā)送到視圖層(異步),同時(shí)改變對應(yīng)的 this.data 的值(同步)。callbackFunction否回調(diào)函數(shù)1.5.0
object 以 key,value 的形式表示將 this.data 中的 key 對應(yīng)的值改變成 value。 callback 是一個(gè)回調(diào)函數(shù),在這次setData對界面渲染完畢后調(diào)用。
當(dāng)前名稱:小程序頁面注冊Page() 函數(shù)
URL地址:http://jinyejixie.com/news29/181929.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供App設(shè)計(jì)、建站公司、網(wǎng)站導(dǎo)航、小程序開發(fā)、搜索引擎優(yōu)化、企業(yè)建站
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容