這里只要熟悉頁面的基本生命周期即可,業務在指定生命周期函數內書寫。
以下是官網給出的生命周期函數方法和狀態圖
上面的生周期函數圖對于做Android 或者IOS的來書理解起來應該不是難事,具體怎么掌握只有慢慢嘗試和摸索
代碼處理:
這里的代碼主需要對使用創建項目時index目錄下文件處理下就行,至于跳轉后的頁面用的還是logs不需要更改!下面貼下代碼注釋也比較詳細
index.wxml
<!--index.wxml--><view class="container"><!--綁定點擊事件--> <view bindtap="bindViewTap" class="userinfo"> </view> <view class="usermotto"> <!--數據綁定--> <text class="user-motto">{{motto}}</text> </view></view>
index.wxss
/**index.wxss**/.container { width: 800; height: 800;}.userinfo { width: 120rpx; height: 120rpx; background: red;}
index.js
//index.js//獲取應用實例var app = getApp()Page({ /** * 通過data初始化數據 */ data: { motto: '點擊上面View跳轉', // userInfo: {} }, //事件處理函數 bindViewTap: function() { //通過調用API進行跳轉 wx.navigateTo({ url: '../logs/logs' }) }, /** * 監聽頁面開在加載的狀態 * 頁面加載完成之后就不會在執行 */ onLoad: function () { console.log('index---------onLoad()') // //this指的就是本頁面對象 // var that = this // //調用應用實例的方法獲取全局數據 // app.getUserInfo(function(userInfo){ // //更新數據 // that.setData({ // userInfo:userInfo // }) // //更新本頁面 // that.update() // }) }, /** * 監聽頁面顯示, * 當從當前頁面調轉到另一個頁面 * 另一個頁面銷毀時會再次執行 */ onShow: function() { console.log('index---------onShow()') }, /** * 監聽頁面渲染完成 * 完成之后不會在執行 */ onReady: function() { console.log('index---------onReaday()'); }, /** * 監聽頁面隱藏 * 當前頁面調到另一個頁面時會執行 */ onHide: function() { console.log('index---------onHide()') }, /** * 當頁面銷毀時調用 */ onUnload: function() { console.log('index---------onUnload') }})
相關文章:
hello WeApp icon組件
Window text組件 switch組件
tabBar底部導航 progress組件 action-sheet
應用生命周期 button組件 modal組件
頁面生命周期 checkbox組件 toast組件
模塊化詳 form組件詳 loading 組件
數據綁定 input 組件 navigator 組件
View組件 picker組件 audio 組件
scroll-view組件 radio組件 video組件
swiper組件 slider組件 Image組件
新聞熱點
疑難解答