博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
vue-router 3.0版本中 router.push 不能刷新页面的问题
阅读量:6909 次
发布时间:2019-06-27

本文共 796 字,大约阅读时间需要 2 分钟。

在 github 的 vue-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 的不是同一个,而之前的版本中能直接这样使用,应该是使用了单例。
至于为什么不使用单例了,这个我怎么会知道?

转载地址:http://fwwcl.baihongyu.com/

你可能感兴趣的文章
IOS——定位单元格子视图
查看>>
HTML DIV+CSS制作通栏总结
查看>>
Ubuntu 14.0.4下 JDK + Tomcat + Intellij IDEA 安装配置
查看>>
【设计模式】链接模式
查看>>
编程思想之回调
查看>>
Mac下如何获取JAVA_HOME路径
查看>>
LockSupport和synchronized混合死锁问题
查看>>
左旋转字符串
查看>>
Oracle 11g学习笔记(三)
查看>>
整理linux平台下的vim插件配置,减少到11M,简化安装
查看>>
解决CentOS 7.0 VMware虚拟机没有网卡,配置网卡信息
查看>>
PHP 开发 APP 接口 学习笔记与总结 - APP 接口实例 [5] 版本设计分析及数据表设计...
查看>>
09.List集合
查看>>
Java网络编程——12.UDP
查看>>
全局NSTimer导致的内存泄露及解决办法
查看>>
数据结构-深入浅出细谈八大排序
查看>>
获取认证用户的相关信息 spring MVC的security模块
查看>>
wine中文乱码的终极解决方法
查看>>
PHP对CURL函数的封装,支持GET/POST请求
查看>>
sql server 存储过程事务与异常处理的一般方式
查看>>