1. 程式人生 > >使用dva routerRedux.push跳轉頁面攜帶引數時請求兩次問題

使用dva routerRedux.push跳轉頁面攜帶引數時請求兩次問題

發現問題

頁面使用routerRedux.push([path])進行跳轉,部分頁面跨頁傳參也是使用這種方式,然後發現了一個很奇怪的現象,部分頁面接受引數後,執行兩次subscriptions,所以導致兩次請求。在dva的issues裡面看到了2016年有人提過這個問題,並被列為bug解決了。很奇怪在這為什麼復現了。

尋找原因

想知道從頁面載入到請求結束到底發生了什麼,這就要藉助工具了----Redux devTools,是用它可以記錄整個過程並進行回放,在回放裡發現了原因:

圖中標記的就是進入頁面後發出的兩次請求,對比後發現,兩次的pathName有所不同,第一次裡面有漢字,而第二個裡面漢字被編碼了。是不是因為漢字的原因呢?

驗證

將URL引數裡面的漢字在push前使用encodeURL轉碼,果然,頁面只有一次請求了。

查詢資料

只有字母和數字[0-9a-zA-Z]、一些特殊符號"$-_.+!*’(),"[不包括雙引號]、以及某些保留字,才可以不經過編碼直接用於URL。

解決問題

將所有涉及漢字的引數使用encodeURL轉碼,在使用時使用decodeURL轉換回來。