vue-router3.0版本中 router.push 不能刷新页面的问题

站长资源 2024/11/27 佚名

2 0 1

在 github 的 vue-router 中找到同样的一个问题：3.0.1版本通过router实例无法跳转

昨天发现有些路由不能正常跳转，找了一下发现都是那些实例化后使用 router.push 而不是直接使用 this.$router.push 的地方。
出现的情况是 router.push 后，url变化了，但是页面没有刷新，手动刷新一下才出现应有的画面。

我看了一下 package.json，我的 vue 和 axios 是没有写版本号，但 vue-router 明明写了版本号，怎么可能以前行的，现在就不行了呢？

然后，我使用 npm view vue-router 查看后才发现使用的已经不是 package.json 中的版本了，于是断定也许是我前几天 npm update 了！

( 以后不要随便 update 了! )

具体为什么新版本不行了，我也不太清楚。

最简单的解决办法当然是直接把 router.push 改成 this.$router.push

但是，如果这样可以的话，我当初为什么要在组件内再实例化一个 Router 呢？

显然是因为有些地方的 this 并不是 vue,那么，再实例化一个 vue，然后使用 vue.$router 行吗？

答案当然是不行的，因为这个 vue 与其它地方的 vue 应该又不是同一个对象了。

那么，终极的解决方案就是：

把全局的 vue 中的 router 加到 window 中，也就在 main.js 中使用：

window.router=router

然后其它任何地方就可以直接愉快地使用 router.push 等 router 的方法了。

分析原因：

实例后的 router 不能刷新页面，应该是因为它与全局的vue中的 this.$router 的不是同一个，而之前的版本中能直接这样使用，应该是使用了单例。

至于为什么不使用单例了，这个我怎么会知道？

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。

vue,router.push,刷新

广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！

评论“vue-router3.0版本中 router.push 不能刷新页面的问题”

暂无评论...

www.wwsws.com 伏龙阁资源网

39,976影音资源

44,792技术资源

21,817软件资源

651,128站长资源

2024年11月27日