Vue-Router 用 router.go(-1) 返回上级页面后,如何不刷新数据?

2021-03-15 14:22:21 +08:00
 exc
Vue-Router 操作 History 时,使用 router.go(-1) 返回上级页面后,上级页面的数据会被重置,重新走一遍组件生命周期,等于刷新页面。

如何不让页面自动刷新呢,或是在需要的时候刷新?
1182 次点击
所在节点    问与答
11 条回复
exc
2021-03-15 14:23:25 +08:00
测试: https://jsfiddle.net/1av9brxc/2/

复现路径:点击 Home 输入一段字符,可以看到打印,然后点击 Foo 或 Bar,再返回(或点击返回按钮),Home 输入框里的文字不见了。
liyang5945
2021-03-15 14:31:35 +08:00
keep-alive
yunyuyuan
2021-03-15 14:36:12 +08:00
yaphets666
2021-03-15 14:37:11 +08:00
实现的方法很多,B 回 A 页面,在 A 页面路由守卫中判断来源页面,从而判断是否加载数据.同理还有返回 A 页面时携带参数.
还有就是 A 页面 keep-alive
exc
2021-03-15 15:16:00 +08:00
@liyang5945 @yunyuyuan @yaphets666 谢谢,这就去试试
exc
2021-03-15 15:36:08 +08:00
@yaphets666 同理还有返回 A 页面时携带参数。返回 A 页面时,如何携带参数呢?
lopda
2021-03-15 15:39:51 +08:00
@yaphets666 赞同~
yunyuyuan
2021-03-15 15:50:10 +08:00
@exc #6 改 params 或者 store+watch
exc
2021-03-15 16:12:59 +08:00
@yunyuyuan router.go() 函数好像不支持 params 参数吧?
yunyuyuan
2021-03-15 16:17:50 +08:00
@exc go(-1)无法知道上一个页面,当然无法传参数。如果你既不知道要去的上一个页面是哪个,又想传参数给那个页面,用 store+watch 就行了
exc
2021-03-15 17:10:51 +08:00
@yunyuyuan 嗯嗯,也可以,不过 store 是全局持有吧,有没有类似通知的函数呢?因为 vue-router 肯定知道上一个页面嘛,那么他在加载上个页面时,调用一个重新打开方法就可以了。类似 Android 生命周期里的 onResume 方法。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/761772

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX