本文共 2071 字，大约阅读时间需要 6 分钟。
具体的原因 还是 看看https://www.cnblogs.com/attacking-cabbage/p/10846211.html
这个问题的原因是因为当用vuex做全局状态管理的时候，store中的数据是保存在运行内存中的，页面刷新时会重新加载vue实例，store中的数据就会被重新赋值，因此数据就丢失了
可以用local storage 但是 性能不太好 所以 可以用文中方法 也可以下面 因为是跳转到了新的界面之后数据消失了 所以 传进去的路由不要传vuex里面的
要刨根问底呀~ 不然不会进步
子组件这样
不过就是解析的时候有点难看 this.details = JSON.parse(this.$route.query.details);外面推的时候
this.$router.push({ name: 'screen',query:{details: JSON.stringify(this.details)} })local storage不好
是路由传的时候没传进去？我的天啊 这我怎么能想的到 先是传递进去的时候 param改成了 query 然后 具体的detail是哪里赋值的？看了一下，原来是在外面赋值 然后存到detail里面去， 里面刷新 外面的就没了（大概是这个意思） 然后 就把detail保存一下 直接传进子组件里面去 不依赖于vuex的全局变量（刷新的时候会重新创建实例） 后来发现这个vuex的问题，除了detail之外 其他的用户名什么的也会一起出问题。于是我~ 一起改了改 因为太多，而且怕roles直接全局替换不太好？emmm然后反正就 this.roles=this.$store.state.user.roles; //console.log("百试百灵bug消除",this.roles); this.$router.push({ name: 'contractDetail', query: { compo: compo,details: JSON.stringify(this.details), roles: JSON.stringify(this.roles)}}); this.$store.state.user.roles = JSON.parse(this.$route.query.roles); _(:з」∠)_ _(:з」∠)__(:з」∠)_ 关键是这个gg的还有两个地方跳转，经常搞混。（吐槽一下自己找到一堆bug 测试啥都看不出来 跟他说了也只知道端口和发数据。。。你行你来啊）=====================================================
然后有一个可以说是极其重大的发现，就是如果js错误的话，火狐没报，也可能我不会看？（谷歌的开发者界面难用得都不能用。。还是火狐吧）页面还是好的，继续跑，所以你会发现没有console.log 只是因为里面错了 只是因为里面错了 不是因为create没有被调用 哈哈哈哈 今天改这个的时候 其实其实完全只是因为role没定义 不是传不进来 反正到处console看一下嘛 前后数据都有的 恍然若悟 还是用那个分段法 把我这句百试百灵到处摆上 然后定位跑到哪里的时候不动了/ 一般create里面这样解决完全足够~ 前端还是很有意思的哈哈哈哈 wish u enjoy it =====================================================对了 最后 每次喝酸奶的时候 我都感觉人生价值得到了升华
==========================================================传递数据
3. 通过 query 传递
// 带查询参数，变成 /register?plan=private
router.push({ path: 'register', query: { name: 'sxh' }});注: query 传参是针对 path 的
这种接收参数的方式是
this.$route.query.name
其他方法
1. 通过 path 传递
this.$router.push({path:`/user/${userId}`});
// this.$router.push(`/user/${userId}`);注: 这样传递参数的话, 配置路由的时候需要在 path 上加参数: path: 'user/:userId'
这种接收参数的方式是
this.$route.params.userId
2. 通过 params 传递
// 命名的路由
router.push({ name: 'user', params: { userId: 123 }});注: params 传参是针对 name 的
这种接收参数的方式是
this.$route.params.userId