微信小程序頁面間跳轉如何監聽事件

    摘要: 在微信小程序的開發過程中,我們可定會遇到頁面間相互跳轉的需求,那么如何監聽頁面跳轉之間的事件呢?我們在之前的一篇文章:藝龍微信小程序框架組件研究(附源碼)為例,來看一看小程序在頁面之間相互跳轉時的事件 ...

    在微信小程序的開發過程中,我們可定會遇到頁面間相互跳轉的需求,那么如何監聽頁面跳轉之間的事件呢?我們在之前的一篇文章:藝龍微信小程序框架組件研究(附源碼)為例,來看一看小程序在頁面之間相互跳轉時的事件機制。愛掏網 - it200.com

    我們知道小程序提供打開新頁面、頁面重定向、頁面返回、tabBar切換四種改變視圖的機制,托管了頁面的生命周期,并為應用提供了相應的生命周期事件,方便應用各階段的業務處理,但頁面之間相互跳轉并沒有相應的事件機制,例如——

    1、A頁面打開二級頁B,B頁面做了一些操作,要通知A頁面做相應的處理。愛掏網 - it200.com
    2、從B頁面攜帶一些數據,返回到A頁面

    以上兩種場景很常見,歸結為頁面間如何方便的進行交互,當然我們可以通過頁面跳轉傳參或全局數據對象來達到目的,但是使用上有些束縛(轉換參數或維護全局對象)!

    所以在elong小程序項目中采用事件機制解決這一問題。愛掏網 - it200.com我們重寫了navigateToAPI,A頁面調用該接口進行頁面跳轉后,方法返回給A頁面一個事件對象 event,該對象可以注冊自定義事件,目標頁面(B頁面)可以按照業務需求觸發事件響應,同時將相關數據作為參數傳遞到監聽處callback。愛掏網 - it200.com
    A頁面


    B頁面

    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'
                });
            },
    登錄后復制

    打開二級頁面效果圖——


    以上就是微信小程序頁面間跳轉如何監聽事件的詳細內容,更多請關注愛掏網 - it200.com其它相關文章!

    聲明:所有內容來自互聯網搜索結果,不保證100%準確性,僅供參考。如若本站內容侵犯了原著者的合法權益,可聯系我們進行處理。
    發表評論
    更多 網友評論0 條評論)
    暫無評論

    返回頂部

    主站蜘蛛池模板: 中文字幕一区视频| 国产亚洲福利精品一区二区| 毛片无码一区二区三区a片视频| 波霸影院一区二区| 亚洲AV香蕉一区区二区三区| 亚洲av福利无码无一区二区| 一区二区三区影院| 一区二区三区四区无限乱码| 无码日本电影一区二区网站| 亚洲一区二区三区高清| 伊人久久大香线蕉av一区| 日韩精品一区二区三区影院| 国产精品一区二区电影| 中文字幕精品一区二区| 精品国产一区二区三区不卡| 久久久国产精品亚洲一区| 国产免费无码一区二区| 国产人妖视频一区二区| 一区二区视频传媒有限公司| 精品亚洲一区二区三区在线播放| 日本一区二区三区在线网| 国产suv精品一区二区6| 日本无卡码免费一区二区三区| 国产一区二区三区小说| 日韩福利视频一区| 国产成人一区二区精品非洲| 久久精品综合一区二区三区| 中文无码AV一区二区三区| 久久精品中文字幕一区| 国产另类TS人妖一区二区| 无码人妻久久一区二区三区免费| 国产无线乱码一区二三区 | 在线观看国产一区| 日韩精品无码一区二区三区AV| 又硬又粗又大一区二区三区视频| 亚洲无人区一区二区三区| 无码精品一区二区三区免费视频| 国产精品合集一区二区三区| 午夜视频在线观看一区二区| 亚洲一区二区三区乱码A| 亚洲AV综合色一区二区三区 |