1. 程式人生 > >【小程式】當前“頁面B”動態更改title,點選返回按鈕,更改的標題會顯示在“來源頁面A”

【小程式】當前“頁面B”動態更改title,點選返回按鈕,更改的標題會顯示在“來源頁面A”

最近在做小程式的時候遇到這麼一個有趣的問題,就是從A頁面跳轉到B頁面,如果B頁面需要在介面載入之後更改title,
並且如果介面請求過慢,還滅有請求完畢時就點選返回按鈕回到A頁面,這時B頁面的請求會繼續執行,並在執行完畢後修改了A頁面的title。

原因

個人猜想,小程式本身屬於單頁面應用,程式碼的執行許可權沒有處理好,就像上面這種情況,B頁面的程式碼穿越到了A頁面的環境裡面,並且執行。

解決

  1. 既然B頁面的請求方法可以在A頁面執行,那麼在B頁面的方法中獲取的當前的頁面路由時就有可能可以獲取到A頁面的路由,經過測試果然不出所料。
  2. 所以,可以這樣來解決這個問題:在B頁面的onLoad中獲取當前頁面路徑,應該是/b
    ,然後在方法中再次獲取當前路徑,可能是/b,也可能是/a
    若是/a,則是上面提到問題情況,這個時候就不用取改變title了,若是/b,則可以更改。

程式碼

// utils.js
const getCurrentRouter = function () {
  let arr = getCurrentPages(),
      len = arr.length;
  return arr[len - 1].route;
}

export {getCurrentRouter};


// b.js
import {getCurrentRouter};
import { getDataForB } from
'../../../servies/services.js'; Page({ onLoad (options) { this.currentRouter = getCurrentRouter(); }, // 獲取資料 getData () { getDataForB().then(() => { // 獲取資料後判斷router是否一致 if (this.currentRouter == getCurrentRouter()) { wx.setNavigationBarTitle({ title: '要修改的title'
}) } }) } })

個人部落格:午後南雜