react 實現類似vue中的 的功能,並解決antd-mobile切換回來時的空白


  1. 在移動端的spa頁面中,只要使用到了路由就很有必要使用到狀態保存的功能,這樣才能保證在頁面進行切換的時候,讓用戶可以看到剛才滑動的地方,讓用戶的體驗更加友好。這兒我找到了react-router-cache-route這個插件,使用方法直接參考文檔。

  2. 在使用了這個插件以后,結合着antd-mobile使用時。會出現輪播圖空白的現象,這個現象在手機端顯得憂外的明顯

  3. 上面問題的解決方法就是使用 react-router-cache-route 這個插件以后額外引入的聲明周期,然后使用 forceUpdate 進行強制更新。代碼如下:

constructor (props) {
    ...
    props.cacheLifecycles.didRecover(this.componentDidRecover) 
}

componentDidRecover = () => {
  console.log('被恢復時');
  // 強制更新
  this.forceUpdate();
}


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM