小程序開發之二(路由攔截設計)

原文地址:http://callmesoul.cnjson

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

1.app onLaunch小程序

2.若是有app onLaunch 的 path參數有值則跳到 path對應頁面不然爲app的json第一個路由app

onLaunch 的path怎麼來的?

1.經過分享給朋友的接口傳的path異步

暫時只發現這個函數

app onLaunch 裏攔截路由?

之後可得知小程序統一入口就是app的onLaunch,因此在onLaunch 攔截是最理想的。可是onLaunch裏並無提供攔截的接口或方法,當你在onLaunch有異步處理時,還沒處理完,onLaunch就直接跳到了下一個頁面了。code

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

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

因此在app沒辦法實現。it

app.json第一個路由裏攔截!!!

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

分享的頁面帶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...
   }
}

大概流程就這樣。

相關文章
相關標籤/搜索