vue跳转同一路由页面不跳转

最新推荐文章于 2023-09-08 18:33:42 发布
最新推荐文章于 2023-09-08 18:33:42 发布
阅读量2k 收藏 2
点赞数
分类专栏： 前端 文章标签： vue vue-router 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_51299408/article/details/123712490
版权

问题:

路由跳转了， 但是页面数据没有改变， 必须要刷新一下才可以改变

分析:

虽然地址改变了，但是页面只会创建一次，不会再次去发送请求,setup只会执行一次，导致页面不会刷新

解决:

只需要给<RouterView / >增加唯一的key就ok

 

weixin_51299408
关注
专栏目录
vue 同一个页面路由无反应_Vue同一路由跳转页面不刷新解决方案及注意事项
weixin_28796657的博客
02-11 5602
默认情况跳转至同一个路由地址(path相同，即使params或者query不同也算同一个)的话，只是浏览器url变了，其它是不会发生任何变化，这就是网友常说的“同一页面跳转，路由变了但是页面不刷新”。我们可以写两个测试页面// goNext.vue跳转至自身跳转至goBackexport default {name: 'goNext',mounted() {console.log('组件生命周期 ...
vue 跳转同一路由,页面不刷新解决方案
qq_35897953的博客
08-10 1万+
vue 跳转同一路由,页面不刷新解决方案 问题原因 ： vue官网详细解释说明使用同一路由携带不同参数，本质上是重用相同的组件实例，默认在跳转路由时会采用缓存策略,并不会刷新当前路由组件，因此不会调用组件的生命周期挂钩 解决方案1 - 监听路由变化 官方提供的解决方案为要对同一组件更改做出反应，监听$route的变化，或者使用使用2.2中引入的beforeRouteUpdate 导航卫士，调用对应的方法 //#/mk_gsui?id=2 // 监控data中的数据变化 watch: { $r
vue系列之---- 跳转同一路由,页面不可刷新不可跳转问题解决方案
hyduan_h5的博客
09-03 5405
在项目中经常有这样的需求，同一页面路由根据不同参数，渲染不同数据、不同效果、甚至重新刷新整个页面。但由于路由的强缓存原因，同一路由跳转往往不会进行刷新，故而总结了几种解决办法。 方法1： 实现原理： 点击当前菜单，先跳转过渡空白页面，再跳转原页面； 实现优点 简单方便快速统一 实现缺点 所有页面都将进行刷新，且因跳转其他页面故反应时间较长 实现代码 新建empty.vue <template></template> <script> export d.
vue-router同路由$router.push不跳转一个简单解决方案
热门推荐
wulala_orz的博客
12-29 3万+
vue-router同路由$router.push不跳转一个简单解决方案vue-router跳转一般是这么写：toCurrentPage: function(thisId){ this.$router.push({path:'/test ', query: { id: thisId, option: ""}}); }但是当遇到，需要跳转同页面不同query的情况，上面的方法不起
vue相同地址路由点击链接禁止跳转
qq_26889291的博客
03-13 321
【代码】vue相同地址路由点击链接禁止跳转。
【Vue】Router路由无法跳转问题整理
Sheldon74的博客
09-08 1万+
Vue Router路由无效或异常等问题整理
vue 跳转 同一路由不刷新问题解决(相同path不同query)
01-08
 遇到个需求，要求在同一个path下，通过不同的query实现跳转不同的页面，大概就是下面这个样子: 这样当全路径变化的时候，就会触发跳转了。 BerySteven_shen 原创文章 79获赞 39访问量 6万+ 关注
vue跳转同一路由页面不刷新
最新发布
10-22
在Vue中，同一路由跳转不会重新执行生命周期，因此数据不会更新，无论是动态路由还是传参都不会刷新页面。这是因为路由的强缓存原因，同一路由跳转往往不会进行刷新。为了解决这个问题，可以采用两种方法：一是通过...
vue相同路由跳转强制刷新该路由组件操作
10-14
在Vue.js应用中，路由是...在进行路由跳转和组件刷新时，理解Vue Router的工作原理至关重要，这可以帮助我们编写出更加灵活且可维护的代码。同时，遵循最佳实践和避免常见错误，如路由命名冲突，也能提高应用的质量。
如何解决vue的this.$router.push()在同一页面无法跳转问题
qq_45632139的博客
05-20 1万+
在做项目的检索功能时碰到这样一个问题，首先所有的页面都包含了这个headers， headers写了搜索框以及按钮,点击搜索之后要跳转到检索的页面，但是当你正好处在检索页面的时候点击检索之后参数居然不发生变化，一查，结果是this.$router.push()无法再一个页面做跳转 解决方法： 这里的解决方法比较粗暴 我使用window.localtion.href = ‘路由’+’?参数’ 就可以直接跳转了 ...
vue，使用监听判断路由跳转给子界面传递数据，第一次不生效的问题
qq_57031340的博客
08-14 908
建议使用activated来获取传参，watch性能消耗太大。
vue在当前页不跳转显示另一个页面_你了解vue的组件吗？有没有实现过一个组件？...
weixin_33308507的博客
01-26 1747
上次已经讲解过vue组件的实现过程，具体可以看这篇文章：http://blog.aizhifou.cn/articles/2020/04/26/1587882114011.html今天用vue来实现一个分页组件，总体来说，vue实现比较简单，样式部分模仿了elementUI。所有代码的源码可以在github上下载的到：https://github.com/jackzhujie/vue-study先...
vue配置路由，路由不跳转，页面不显示
qq_41988113的博客
04-26 1万+
问题1：路由不跳转 遇到这个问题第一时间去检查自己的代码 （1）在router index.js中 ①查看这两个routes是否一致 const routes:[ ... ] const router = new VueRouter({ routes, }) ②配置中的component是否多加了s { path: '/home', component: Home }, ③导入的文件路径是否正确 const Home = () => import('../vi
Vue-Router路由首次跳转页面空白,刷新页面又可以正常访问
全干攻城狮
05-18 1万+
背景 最近项目过程中出现了一个奇怪的问题，当用户登入系统后部分路由首次跳转时会出现空白页面，但是在该页面上刷新又可以正常显示路由对应的页面。 系统内包含用户、角色、菜单等管理模块，前端使用了动态路由 问题复现 系统内有两个角色，A1和A2 A1角色包含P1、P2、P3页面的权限 A2角色包含P1、P2、P3、P4、P5页面的权限 当首次使用A1角色对应的用户登入系统时，侧边栏所有菜单都可以正常访问 此时退出A1角色对应的用户并使用A2角色对应的用户登入系统，其中P1、P2、P3菜单对应的页面可以正常访问，
vue中相同路由传不同参数的模块展示进行跳转时页面不刷新问题解决方案
weixin_46408500的博客
09-06 808
2、在展示区的 router-view 标签上控制 key 属性变化。1、添加 watch 监听路由参数变化强制页面刷新。
关于vue中带参数的页面之间跳转
M_y_y的博客
08-23 2618
客套话不多说，直接进入主题 以我现在的知识，我认为vue中页面之间的跳转都是通过路由router来跳转，即： this.$router.push({path: '你要跳转的路由路径'}) 在跳转中如果传递参数时有两种方法 （1） this.$router.push({path:'你要跳转的路由路径',query:{paramName:paramValue}}) 跳转过去用接收 ...
解决路由跳转到同一个页面，vue页面不刷新问题
记录本人工作中遇到的问题、经验总结以及分享。
02-14 1206
原理：使用 watch 监听路由变化，手动更新数据。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值