vue.$router.push()方法刷新同一个界面时，路由重复报错导致页面不刷新。

最新推荐文章于 2024-06-16 21:44:47 发布
最新推荐文章于 2024-06-16 21:44:47 发布
阅读量2.9k 收藏 1
点赞数
文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_43219902/article/details/109695152
版权

问题如下

写一个搜索功能时，用到的时点击搜索按钮跳转到搜索结果页面，每次点击将搜索的keywords作为参数传到下一个界面。再多次点击后报错如下
在这里插入图片描述原因是路由重复报错，不能push重复的路由，下面是我点击搜索按钮后执行的方法
在这里插入图片描述

解决方法：

在这里插入图片描述

2697514554
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vue-router 3.1.6，.push相同路径时报错的问题 Uncaught(in Promise)
Janus_lian的博客
05-21 728
本来不想将博客作为一个记录踩坑笔记的地方，就想没事写个心情文吖，没想到，又踩坑了。（估计以后还会踩坑很多，因为到了新公司用的和之前都不一样了。。。。） 一、问题描述 使用vue-router跳转相同路由的时，比如在 /defend 路由下，使用 this.$router.push(’/defend’)再次跳转当前路由，控制台会报以下错误。 简单的意思就是：导航重复了（NavigatingDuplicated），message中也说了，不允许导航到当前位置（Navigating to current loc
vue.js this.$router.push获取不到params参数问题
10-15
`this.$router.push`方法是用于导航到新的路由的关键函数，但有时候我们在传递`params`参数时可能会遇到一些问题。本文将详细讲解如何正确地使用`this.$router.push`传递和获取`params`参数，并分析为何会出现获取不...
vue-router重写push方法，解决相同路径跳转报错
u013595395的博客
11-05 1万+
修改vue-router的配置文件，默认位置router/index.js import Vue from 'vue' import Router from 'vue-router' /** * 重写路由的push方法 * 解决，相同路由跳转时，报错 * 添加，相同路由跳转时，触发watch (针对el-menu，仅限string方式传参，形如"view?id=5") */ co...
vue-router 跳转同一页面报错简单解决方法
qq_44727862的博客
10-19 247
vue-router 跳转同一页面报错。
element-vue3-admin用router.push跳转新页面并刷新新页面
最新发布
weixin_44534057的博客
06-16 788
element-vue3-admin用router.push跳转新页面并刷新新页面
Vue中使用[$router.push]重复点击报错解决方案
VCLife
07-30 1864
$router.push() 重复点击的时候会报错,这个错误老早之前也是没有的,后来router更新了一次有了 为什么会报这个错误,为了防止重复渲染组件,抛出来的一个错误 那么如何解决?
解决vue-router重复点击报错问题
Jermyo的博客
05-20 379
解决vue-router重复点击报错问题 在index.js路由配置文件 ```javascript import Vue from 'vue' import Router from 'vue-router' //解决vue-router重复点击报错问题（this.$router.replace()） const originalPush = Router.prototype.replace; Router.prototype.replace = function replace(location) {
vue路由每次访问相同的路由，都会刷新
张大晴的博客
09-18 5345
      转自：https://www.zhihu.com/question/49863095/answer/289157209 参考文档： https://blog.csdn.net/qq_39009348/article/details/81700082 作者：知乎用户 链接：https://www.zhihu.com/question/49863095/answer/28915...
vue 按钮跳转新页面_vue router 跳转时打开新页面的示例方法
weixin_39594312的博客
12-22 4755
vue router 跳转时打开新页面的示例方法记录一下在vue项目中如何实现跳转到一个新页面(一个比较简单又比较基础的问题了)，有两个方法：1、标签实现新窗口打开官方文档中说 v-link 指令被 组件指令替代，且 不支持 target="_blank"属性，如果需要打开一个新窗口必须要用 标签，但事实上vue2版本的 是支持 target="_blank" 属性的(tag="a")，如下...
解决vue.js this.$router.push无效的问题
12-09
在Vue.js应用中，`this.$router.push`是用于实现页面路由导航的重要方法。当它不起作用时，可能会导致开发者困惑。以下是一些常见的原因和解决策略，针对标题和描述中提到的问题进行深入分析。 首先，我们需要理解...
Vue中this.$router.push参数获取方法
11-26
由于动态路由也是传递params的，所以在 this.$router.push() 方法中path不能和params一起使用，否则params将无效。需要用name来指定页面。 及通过路由配置的name属性访问 在路由配置文件中定义参数：   通过name...
vue-router3.0版本中 router.push 不能刷新页面的问题
11-30
然而，在Vue-Router 3.0版本中，开发者可能会遇到一个常见问题：使用`router.push`进行页面跳转时，URL会改变，但页面内容不会自动更新，除非手动刷新页面。这个问题在GitHub上也有相关的讨论，特别是在3.0.1版本中...
解决vue-router同一个页面地址栏参数改变，页面不刷新的问题
Carina的编程技术博客
09-22 500
给router-view加个唯一的key，来保证路由切换时都会重新渲染触发钩子
解决vue路由跳转到同一页面的刷新问题
热门推荐
sinat_41200024的博客
03-18 1万+
问题描述：当我使用路由跳转页面时，如果页面跳转是同一个路由，传递的参数不同时，页面不刷新， 如下图：待收定金和待收首款其实跳转的是同一个组件 ，只是他们传递的参数不同而已。 当我使用路由进行跳转时，我发现第一次是可以正确跳转的，比如我当前在其他页面，当我点击一个“待收定金”他可以正常的跳转到指定组件去，此时当我再点击“待收首款”时，页面不刷新，还是之前的数据，查了很多资料也没找到合适的解决办法。...
vue路由，解决同一路由页面多次触发不刷新页面
zimu_spm的博客
12-01 854
需求：点击同一个路由，重复刷新页面 解决思路： 1.放一个刷新页面 ，此页面为空页面，如下： <template> </template> <script> export default { beforeRouteEnter(to,from,next){ next((vm) => { vm.$router.replace(from.path); }); } } </script> &l
解决Vue路由重复点击报错问题
shi15926lei的博客
11-23 2318
解决Vue路由重复跳转报错问题
vue3使用router.push()页面跳转后，该页面不刷新问题
wang13679201813的博客
09-20 7388
这是一个常见问题，当使用push的时候，会向history栈添加一个新记录，这个时候，再添加一个完全相同的路由时，就不会再次刷新了。在页面跳转时加上params参数时间。在跳转到的页面，添加watch监视。
router.push不刷新（8种解决方案）
leveretz的博客
11-13 1万+
router.push不刷新（8种解决方案）
vue $router.push 跳转到当前页面 地址栏变但是数据不刷新
qq_26241443的博客
03-30 2528
vue-router跳转页面时，如果name和当前页面的name一样，只是query的参数不一样，那么会导致页面内容不刷新，因为页面内容是在created中根据route中的参数来获取的，但是跳转当前页面不会出发created。
vue this.$router.push页面不刷新
01-04
根据提供的引用内容，有多种解决方式可以解决vue this.$router.push页面不刷新的问题。以下是其中的三种解决方式： 1. 使用`this.$router.go(0)`方法刷新页面： ```javascript watch: { '$route' (to, from) { //...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值