使用this.$router.push()跳转时，页面没跳转到新路径，反而拼接到原路径后了

最新推荐文章于 2024-03-03 12:42:17 发布
最新推荐文章于 2024-03-03 12:42:17 发布
阅读量4.0k 收藏 1
点赞数 3
分类专栏： 前端Vue 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_29442755/article/details/106732793
版权

在导航栏使用this.$router.push({path: 'download'})进行跳转时，发现没跳转到我想要到download路径下，反而把download拼接到了原路由后，如下：

原路由是这样的：

 

在这个页面下点击导航栏，想跳转到download页面，出现如下效果：

 

最后发现问题是因为path里没加‘/’，应写成this.$router.push({path: '/download'})

现在可以正常跳转了：

椰子牛
关注
  • 3
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
解决vue.js this.$router.push无效的问题
10-18
今天小编就为大家分享一篇解决vue.js this.$router.push无效的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
VueRouter 中' this.$router.push '跳转页面不刷新的问题解决
gyy191425的博客
05-28 1万+
问题疑难 在写vue项目 路由跳转时, 肯定遇到过 路由跳转到新页面后 通过接口查询得到的后台数据, 这时候再返回上一个页面再点击路由跳转的时候会发现 新页面通过接口查询的数据没有了。 这是因为再你第二次点击路由跳转的时候，你的初始函数方法mounted没有执行。 解决办法有两种： 第一种：将mounted函数 替换成activated函数。 mounted(){ 在这里插入代码片 } ...
vue2本地开发环境正常，生产环境下this.$router.push({ name: ‘login‘ })不跳转
最新发布
JaneYork的博客
03-03 501
如果问题仍然存在，请检查浏览器的开发者工具（控制台、网络面板等），查看是否有任何错误消息。如果在Vue.js 2中在本地开发环境下正常运行，但在生产环境下使用​。在检查和解决以上可能的问题之后，你应该能够在生产环境中成功执行​。
Vue中this.$router.push()路由跳转页面并传值最常见两种方式
Xin6Yang的博客
09-27 6518
1. query传参 // query传参 // 传值 this.$router.push({ name: 'orderList', query: { conlltion: id }}) this.$router.push({path:'/orderList',query: {conlltion: id }}) // html取值 $route.query.conlltion // scr...
this.$router.push点了后hash地址改变了，页面却不跳转
weixin_54048131的博客
07-30 7270
this.$router.push点了后hash地址改变了，页面却不跳转
vue 使用this.$router.replace、this.$router.go、this.$router.push 等进行页面跳转不生效
絮落锦乡的博客
03-27 8081
一、问题描述 vue 在使用页面跳转的时候，发现页面总是不调转，或者地址变了，页面不刷新等问题 二、解决方案 1、排查页面是否使用了beforeRouteLeave ，如果使用了该函数，意味着路由被拦截下来进行处理了，这个时候做完逻辑处理后必须要加上 next() 函数，才能让路由继续跳转，否则页面将不会跳转。 2、排查页面是否报错，哪个方法未定义。 3、检查路由配置是否正常。 ...
Vue中this.$router.push()失效解决办法
热门推荐
weixin_45912825的博客
06-09 2万+
问题描述 今天学习Vue的时候准备使用this.$router.push()来跳转页面,但是无论如何也跳转不了，也没有报错. 路由如下: { path:'/home', component:home, name:home }, { path: '/login', component:login, name:login } 从login界面跳转到home界面不成功 解决办法 引入rout
如何解决vue的this.$router.push()在同一页面无法跳转问题
qq_45632139的博客
05-20 1万+
在做项目的检索功能时碰到这样一个问题，首先所有的页面都包含了这个headers， headers写了搜索框以及按钮,点击搜索之后要跳转到检索的页面，但是当你正好处在检索页面的时候点击检索之后参数居然不发生变化，一查，结果是this.$router.push()无法再一个页面做跳转 解决方法： 这里的解决方法比较粗暴 我使用window.localtion.href = ‘路由’+’?参数’ 就可以直接跳转了 ...
VUE中关于this.$router.push 地址更新页面不跳转的问题
weixin_42542422的博客
06-17 1万+
今天用vue做了一个登陆和注册的页面 <div class="btn-box"> <a href="javascript:;" class="btn" @click="login">登录</a> </div> <div class="tips"> <div class="sms" @click="register">手机短信登录/注册</div
vue this.$router.push(’./map’);无法跳转的问题
WellTiger的博客
09-25 2736
1.vue this.$router.push(’./map’);无法跳转的问题 <template> <div style="text-align: center"> <el-button type="primary" style="margin-top: 40vh" @click="onLogin">登录</el-button> ...
vue在请求拦截中,this.$router.push跳转报Cannot read property ‘$router‘ of undefined
m0_50278775的博客
03-24 4023
场景是这样的，当用户进来时，在请求拦截中判断token/ticket（这里我们项目用的是ticket）是否过期，过期的话就跳转到登录页面。 请求拦截是这样的，红框就是我用来跳转到登录页面的 然后就报Cannot read property '$router' of undefined 网上我查到的都是说是this指向问题，但是我看我代码的方法都是用es6的箭头函数，应该不存在this指向问题，不过实在想不出为什么，我就死马当活马医，var that = this; but 还是报错Cannot r
vue.js this.$router.push获取不到params参数问题
10-15
主要介绍了vue.js this.$router.push获取不到params参数问题，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
Vue this.$router.push(参数)实现页面跳转操作
10-14
主要介绍了Vue this.$router.push(参数)实现页面跳转操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vue-router同路由$router.push不跳转一个简单解决方案
shykevin的博客
04-19 7092
一、概述 vue-router跳转一般是这么写： toCurrentPage: function(thisId){ this.$router.push({path:'/test ', query: { id: thisId, option: ""}}); } 但是当遇到，需要跳转同页面不同query的情况，上面的方法不起作用。当然了，从性能来说，理论上这种情况最佳的解决...
vue中this.$router.push 路由跳转提示错误 Cannot read properties of undefined (reading ‘push‘)
qq_37485170的博客
02-01 1万+
后来打印发现可能这个封装的方法里面最初this本身就有问题，打印出来是undefined,那怎么整都找不到$router啊，于是最后在这个js文件中引入了router。项目封装axios的全局拦截的时候遇到一个很奇怪的问题，axios.interceptors.request中遇到接口不是200的情况，想跳到首页，方法如下。当然，要是实在是想不到解决办法，我还有个投机取巧的方法，直接用windows本身自带的路径跳转也可以实现了。附上完整的registerAjax.js。然后像下面这样写，就可以实现了。
$route.push()多次点击跳转报错问题
qq_52693197的博客
05-11 2567
1.出现的问题： 当我们在多次点击this.$route.push()方法以后会出现一下报错： 出现上述的问题是vue-router：“^3.5.3"最新出的vue-router引入了promise(当我们点击了router.push()以后返回的 是一个promise对象。 2.解决的方案： 1.通过给push方法传递相应的成功，失败、的回调，可以通过捕获到当前的错误，可以解决(但不是最根本的方法),将来在别的组件中push|replace.编程式导航还是有类似的错误。 2.重写route.
Vue Router 中‘ this.$router.push ‘跳转页面不刷新的问题
暖一杯茶的博客
01-28 5036
在写vue项目 路由跳转时, 肯定遇到过 路由跳转到新页面后 通过接口查询得到的后台数据, 这时候再返回上一个页面再点击路由跳转的时候会发现 新页面通过接口查询的数据没有了。 这是因为再你第二次点击路由跳转的时候，你的初始函数方法mounted没有执行。 解决办法有两种： 第一种：将mounted函数 替换成activated函数。 第二种：通过路由监听的方法watch()。将mounted下的方法函数放到watch路由下（用户体验不好） ...
this.$router.push拼接后的url是什么样的
05-10
但一般情况下，`this.$router.push` 方法会将指定的路由路径进行拼接，生成完整的 URL。具体的 URL 样式取决于路由的配置和拼接方式。一般来说，路由路径会以斜杠 `/` 开头，并且可能包含参数和查询字符串等内容。...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值