vue相同路由跳转强制刷新该路由组件操作
更新时间：2020年08月05日 15:05:52 作者：CaanDoll
这篇文章主要介绍了vue相同路由跳转强制刷新该路由组件操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
想必大家在平时开发的时候可能遇到这种需求，在打开该菜单页面的情况下，再次点击菜单需要刷新该组件（销毁再创建）。而vue自身如果路由不变的情况下是不会这样做的，那么只能使用一些骚操作了。
1.在菜单的路由跳转上绑定一个随机query参数，例如时间戳或者随机数：
this.$router.push({
path:"/xxx",
query:{
t:Date.now(),
},
});
该操作会触发路由改变，但是组件内的状态没有初始化，因为组件没有被重建。
2.在路由容器上绑定key值：
<router-view :key="$route.path + $route.query.t"></router-view>
大功告成，通过key值的变化去强制刷新该组件。
补充知识：[vue-router] Duplicate named routes definition
浏览器告警信息
[vue-router] Duplicate named routes definition: { name: “index”, path: “/index” }
说明路由命名的name属性重复
举 例：
{ path: ‘', name: ‘index', redirect: ‘/fiibox/personHome' },
改正：
{ path: ‘', name: ‘', redirect: ‘/fiibox/personHome' },
以上这篇vue相同路由跳转强制刷新该路由组件操作就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
当通过AJAX方式取回数据后，使用vue.js可以完美地按一定逻辑在页面上的展示数据，代码简单、优美、自然，而且便于与在用的页面框架集成，本文给大家介绍Vue.js展示AJAX数据简单示例2017-03-03
这篇文章主要介绍了vue-cli3.0之配置productionGzip方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-05-05
前端上传大文件、视频的时候会出现超时、过大、很慢等情况,为了解决这一问题,跟后端配合做了一个切片的功能,本文主要介绍了vue分片上传视频并转换为m3u8文件播放的实现示例,感兴趣的可以了解一下2023-11-11
这篇文章主要介绍了vue2.0 常用的 UI 库实例讲解，非常不错，具有参考借鉴价值,需要的朋友可以参考下2017-12-12
今天小编就为大家分享一篇vue实现将数据存入vuex中以及从vuex中取出数据，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-11-11
这篇文章主要介绍了vue进入页面加载数据缓慢实现loading提示过程，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-08-08
这篇文章主要介绍了解决VUEX刷新的时候出现数据消失,具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-07-07
这篇文章主要为大家介绍了Vite使用Esbuild提升性能示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-08-08
vue-cli3.0如何使用prerender-spa-plugin插件预渲染
这篇文章主要介绍了vue-cli3.0如何使用prerender-spa-plugin插件预渲染，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-05-05
这篇文章主要介绍了vue+element UI实现树形表格带复选框的示例代码，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-04-04
最新评论