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