• 服務熱線:15218380061

    當前位置:文章首頁 >> 小程序開發

    路由攔截設計 微信小程序開發

    時間: 2019-11-17 10:03:35 來源:CallMeSoul 作者:天天編輯 


    茂名淘寶詳情設計

    首先說下小程序的簡單運行:

    1.app onLaunch

    茂名淘寶詳情設計

    2.如果有app onLaunch 的 path參數有值則跳到 path對應頁面否則為app的json第一個路由

    茂名淘寶詳情設計

    onLaunch 的path怎么來的?

    1.通過分享給朋友的接口傳的path

    茂名淘寶詳情設計

    暫時只發現這個

    茂名淘寶詳情設計

    app onLaunch 里攔截路由?

    以后可得知小程序統一入口就是app的onLaunch,所以在onLaunch 攔截是最理想的。但是onLaunch里并沒有提供攔截的接口或方法,當你在onLaunch有異步處理時,還沒處理完,onLaunch就直接跳到了下一個頁面了茂名企業職業照。

    茂名淘寶詳情設計

    例如:你想獲得用戶信息在進入頁面。

    茂名淘寶詳情設計

    你在app onLaunch去請求用戶信息,但onLaunch不會等你請求完再跳到頁面。

    所以在app沒辦法實現茂名企業管理培訓。

    茂名淘寶詳情設計

    app.json第一個路由里攔截?。?!

    既然app里面實現不了只能退居求次在第一個頁面處理了,因為當沒有path(onLaunch(option))也就是正常打開小程序都會進入第一個頁面,我們可以在第一個頁面統一處理好邏輯再選擇去跳其他頁面。

    茂名淘寶詳情設計

    分享的頁面帶path會直接跳到path頁面不跳到第一個頁面?

    其實很簡單分享的時候分享頁面的path填寫第一個頁面路由例如/pages/login,在把你當前頁面的路由作為一個參數一起傳過去:

    茂名淘寶詳情設計
    onShareAppMessage(res) {      let fromPath='/pages/activity'      return {        title: 'xxxxx!',        path: '/pages/login?fromPath='+fromPath,        imageUrl:xxxxx,        success: (res) => {          xxxxxx        }      }    }

    這樣分享出去的頁面就會跳到一個頁面而且是帶你分享的頁面路徑作為參數的。

    茂名淘寶詳情設計

    在第一個頁面獲得分享的路徑做跳轉就好,還可以加些邏輯之類方便多。

    茂名淘寶詳情設計

    上面的寫法有個問題,如果分享的頁面也要參數,分享的path就會有兩個??

    茂名淘寶詳情設計
    /pages/login?fromPath=/pages/activity?activityId=1

    如果這樣直接傳過去第一個頁面,activityId會被攔截掉,所以我們需要一個把問號轉碼的函數轉碼了再傳過去,第一個頁面獲得頁面后解碼再跳轉即可:

    茂名淘寶詳情設計
    onShareAppMessage(res) {      let fromPath='/pages/activity?activityId=2'      fromPath=encodeURIComponent(fromPath);      return {        title: xxxxxx!',        path: '/pages/login?fromPath='+fromPath,        imageUrl:xxxx,        success: (res) => {          xxxx        }      }    }

    然后在第一個頁面使用對應函數解碼即可:

    茂名淘寶詳情設計
    onLoad(params){    if(params.fromPath){            let fromPath=decodeURIComponent(params.fromPath);            ///do somethings...   }}

    大概流程就這樣。

    茂名淘寶詳情設計




    客服 熱線 回頂部
    国产亚洲一本大道中文在线,国产高清在线喷奶水,日本有码中文字幕欧美激情,亚洲乱亚洲乱妇24p,色噜噜综合在线,日韩区一中文字目一区二区,亚洲AV中文二区