摘要: 在微信小程序的開發(fā)過程中,我們可定會遇到頁面間相互跳轉的需求,那么如何監(jiān)聽頁面跳轉之間的事件呢?我們在之前的一篇文章:藝龍微信小程序框架組件研究(附源碼)為例,來看一看小程序在頁面之間相互跳轉時的事件 ...
在微信小程序的開發(fā)過程中,我們可定會遇到頁面間相互跳轉的需求,那么如何監(jiān)聽頁面跳轉之間的事件呢?我們在之前的一篇文章:藝龍微信小程序框架組件研究(附源碼)為例,來看一看小程序在頁面之間相互跳轉時的事件機制。 我們知道小程序提供打開新頁面、頁面重定向、頁面返回、tabBar切換四種改變視圖的機制,托管了頁面的生命周期,并為應用提供了相應的生命周期事件,方便應用各階段的業(yè)務處理,但頁面之間相互跳轉并沒有相應的事件機制,例如——
以上兩種場景很常見,歸結為頁面間如何方便的進行交互,當然我們可以通過頁面跳轉傳參或全局數據對象來達到目的,但是使用上有些束縛(轉換參數或維護全局對象)! 所以在elong小程序項目中采用事件機制解決這一問題。我們重寫了navigateToAPI,A頁面調用該接口進行頁面跳轉后,方法返回給A頁面一個事件對象 event,該對象可以注冊自定義事件,目標頁面(B頁面)可以按照業(yè)務需求觸發(fā)事件響應,同時將相關數據作為參數傳遞到監(jiān)聽處callback。
API Event 部分代碼如下: Page({ data: { userInfo: {} }, navigateToHttp: function () { var event = api.Navigate.go({ url: '../http/index', params: { name: 'billy' } }); event.on("listok", function (params) { console.log(params) }); }, navigateToExternalComponent: function () { var event = api.Navigate.go({ url: '../externalComponent/index' }); }, navigateToInternalComponent: function () { var event = api.Navigate.go({ url: '../internalComponent/index' }); }, navigateToPartComponent: function (params) { var event = api.Navigate.go({ url: '../partComponent/index' }); }, 打開二級頁面效果圖—— |
以上是微信小程序頁面間跳轉如何監(jiān)聽事件的詳細內容。更多信息請關注PHP中文網其他相關文章!

熱AI工具

Undress AI Tool
免費脫衣服圖片

Undresser.AI Undress
人工智能驅動的應用程序,用于創(chuàng)建逼真的裸體照片

AI Clothes Remover
用于從照片中去除衣服的在線人工智能工具。

Clothoff.io
AI脫衣機

Video Face Swap
使用我們完全免費的人工智能換臉工具輕松在任何視頻中換臉!

熱門文章

熱工具

記事本++7.3.1
好用且免費的代碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
功能強大的PHP集成開發(fā)環(huán)境

Dreamweaver CS6
視覺化網頁開發(fā)工具

SublimeText3 Mac版
神級代碼編輯軟件(SublimeText3)