vue服务端渲染,vuex状态丢失问题(模块懒加载)

发布于 2022-09-06 15:20:03 字数 795 浏览 38 评论 0

首先声明,这个问题不影响正常使用。但是确实存在。

简单描述下遇到的问题所在:

  1. 有一个列表页(list)和详情页(artical)
  2. 列表页和详情页的数据都是依赖的一个vuex模块(即blog模块)
  3. 初次载入列表页(list),在asyncData函数中注册blog模块,然后访问数据,没任何问题。(同时在destoryed函数中添加卸载模块的语句)
  4. 从列表页(list)点击进入详情页(artical),详情页中的asyncData函数和列表页的逻辑一样,都是注册blog模块(到这步没任何问题)
  5. 问题出在:详情页加载完毕之后,列表页才销毁从而执行destoryed函数卸载了blog模块,导致详情页访问的数据丢失。如下图所示

图片描述

github地址:https://github.com/felbry/nest

  1. npm i
  2. npm run dev

目前感觉自己配置是没什么问题,搞不明白为什么不是路由跳转前销毁组件(可能自己对这块没有过深入研究,懂得可以赐教一下)
暂时的解决方案就是注册模块加上不同的key,这样在销毁时互不影响,但是感觉不太优雅。

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文