vue路由切换时，若是一个路径但是参数不同，页面不会变化

最新推荐文章于 2025-04-08 15:13:11 发布
最新推荐文章于 2025-04-08 15:13:11 发布
阅读量1.6k 收藏 1
点赞数 2
文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_39241421/article/details/127731382
版权

解决：

使用router-view时，如果在相同路由之间跳转，默认在跳转路由时会采用缓存策略,并不会刷新当前路由组件。即mounted,beforeDestory等钩子函数并不会触发。

可以在router-view 标签上加 :key='$route.fullPath'，获取整条路径包括参数，那么vue会认为都是新路径，就会重新刷新

 

MoonMoonLee
关注
vue解决多个页面同一个路由但是传参不同导致页面跳转数据不刷新
qq_46617584的博客
02-08 2529
vue解决多个页面同一个路由但是传参不同导致页面跳转数据不刷新
vue router路由跳转了，但页面没有变
lwj1372391870的博客
06-29 4638
vue router路由跳转了，但页面没有变
解决vue路由跳转同一页面但参数改变时，页面不刷新的问题
最新发布
qq_45919348的博客
04-08 362
给 router-view 加个 key ，key 就是完整路由。当打开两次页面，但是第二次页面不主动刷新页面。以vue3为例，在app.vue页面。
vue-router路由组件传参，参数改变，页面不刷新问题
weixin_45150813的博客
05-10 2190
vue路由组件传参，参数改变页面不刷新
vue——同一个路由传参不同跳转，页面不刷新问题解决
yehaocheng520的博客
07-22 8078
好久都没有写vue-cli创建的项目了，现在一写，发现了好多坑。 今天遇到一个路由跳转的问题： 这个是非常常见的一个场景： 在当前商品详情页面跳转到另一个商品的详情页面，此时，路由相同，参数id不同 Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: "/productDetail"——报错解决 结果我在使用this.$router.replace({path:'/pro
vue中相同路由传不同参数的模块展示进行跳转时页面不刷新问题解决方案
weixin_46408500的博客
09-06 854
2、在展示区的 router-view 标签上控制 key 属性变化。1、添加 watch 监听路由参数变化强制页面刷新。
解决vue-router在同一个路由下切换,取不到变化的路由参数问题
12-09
通过这种方式，我们可以监控路由参数的变化，并在参数变化时执行相应的逻辑： ```javascript watch: { '$route': function(to, from) { // 这样就可以获取到变化的参数了，然后执行参数变化后相应的逻辑 console...
vue 解决路由只变化参数页面组件不更新问题
10-16
当你使用Vue Router进行页面导航时，通常情况下，当路由路径发生变化时，对应的组件也会随之更新。然而，在某些情况下，如果路由只变化了查询参数（即URL中`?`后面的部分），而路径本身保持不变，Vue Router默认不会...
vue跳转同一个组件,参数不同,页面接收值只接收一次的解决方法
10-16
这里，我们创建了一个对`$route`对象的深度监听器，当路由的查询参数发生变化时，`this.stri`会被更新。 无论是使用`beforeRouteUpdate`还是`watch`，都可以有效地解决同一个组件被跳转但参数不同导致页面接收值只...
Vue2.0使用嵌套路由实现页面内容切换/公用一级菜单控制页面内容切换(推荐)
10-17
这样，当active属性变化时，可以利用Vue Router的编程式导航方法`this.$router.push`来跳转到相应的路由，实现页面内容的切换。 文章还提到，为了增强用户体验，通常在登录成功后，程序会自动跳转到默认的页面。...
vue在App.vue文件中监听路由变化刷新页面操作
10-14
当路由变化时，根据跳转到的页面路径来决定是否执行刷新操作。例如，如果页面跳转到了根路径"/"，则执行location.reload()方法来刷新页面。这种方法简单直接，适用于需要在路由跳转时强制刷新页面的场景。 另外一种...
Vue 路径地址有变动，但是页面并没有变化原因
起飞芜湖的博客
01-12 2783
因为模板里没有加<router-view></router-view>
vue路由跳转页面不变，可能是routes参数的原因
qq_44149057的博客
04-26 2710
我刚开始的时候没有注意，以为new Router里面的参数可以随便命名，后来才发现，原来不是的，这里面的只能传routes,如果使用其他的命名会导致路由跳转了但是页面却没有发生改变。当然导致路由改变但是页面不变可能还有其他原因，这只是其中一种可能。
VUE动态路由跳转后，url改变，页面未刷新--究极解决方案
lmj0920的博客
08-12 3730
VUE动态路由跳转后，url改变，页面未刷新--究极解决方案
【Vue】解决路由切换，页面不更新的实用方法
热门推荐
汪小穆的博客
09-22 6万+
前言：vue-router的切换不同于传统的页面的切换。路由之间的切换，其实就是组件之间的切换，不是真正的页面切换。这也会导致一个问题，就是引用相同组件的时候，会导致该组件无法更新，也就是我们口中的页面无法更新的问题了。
vue中，实现锚点定位及跳转（url不发生变化）
m0_51073906的博客
11-16 2137
出现问题： has模式的原因 页面实现锚点跳转，但跳转之后点击返回列表时候由于url地址出现#id，导致点击列表或创建修改成功不会返回列表。 解决办法： <div class="footer" @click="returnTop"> 跳转 </div> <div id="header"> 内容 </div> methods:{ returnTop:function(){ document.querySelector("
Vue解决路由切换页面导致位置不变的问题
うさぎの喫茶店
03-03 1029
Vue中使用router切换页面会发现页面切换后位置不变 可以在项目的router文件夹中的index.js中添加以下代码 scrollBehavior (to, from, savedPosition) { return { x: 0, y: 0 } } 添加后就可以像刚打开一样展示在页面的最顶端 官网有更详细的解决方案 附上我index.js的全部代码 import Vue from ...
关于vue路由的工作笔记（路由传参和url明明跳转但页面不刷新的原因）
CxOneCom的博客
04-03 587
官方路由文档 1. 路由的参数传递问题： 使用路由导航传递参数格式： this.$router.push({ name: '组件别名', params: {参数名： 值}, }) 接收参数分两步： 在路由中： path：使用/
解决vue路由路径不变只有query参数改变不刷新
weixin_46194350的博客
10-12 3213
解决vue路由路径不变只有query参数改变不刷新
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值