this.$router.push传递参数失败undefined

最新推荐文章于 2024-07-14 11:38:38 发布
最新推荐文章于 2024-07-14 11:38:38 发布
阅读量6.5k 收藏 9
点赞数 5
分类专栏： 前端 vue 文章标签： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_41337100/article/details/106030954
版权
在尝试使用this.$router.push进行路由跳转并传递参数时，遇到query和params始终为undefined的困扰。查阅资料并实践后，发现一种未明确原因但能成功传递参数的方式。详情见vue路由跳转的实践总结。
摘要由CSDN通过智能技术生成

首先据我查的资料，this.$router.push路由跳转有以下几种形式：

1.  不带参数
 
this.$router.push('/home')
this.$router.push({
   name:'home'})
this.$router.
最低0.47元/天 解锁文章
reisaru
关注
  • 5
    点赞
  • 踩
  • 9
    收藏
    觉得还不错? 一键收藏
  • 6
    评论
专栏目录
Vue源码之关于vm.$delete()/Vue.use()内部原理详解
10-17
在使用 Vue.use() 方法时，需要注意的是插件本身必须有一个 install 方法，该方法的第一个参数是 Vue 构造器，之后是通过 Vue.use() 传递的其他参数。 总结来说，vm.$delete() 方法是 Vue.js 的一个工具方法，它...
详解新手使用vue-router传参时注意事项
12-09
在设置路由时，我们会为每个路由定义一个`name`，然后在`this.$router.push`中使用这个`name`并传递参数： ```javascript this.$router.push({name: 'details', params: {'id': 233}}) ``` 在目标组件中，我们...
Vue this.$router.push(参数)实现页面跳转操作
10-14
主要介绍了Vue this.$router.push(参数)实现页面跳转操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vue.js this.$router.push获取不到params参数问题
11-20
主要通过两种方式传参 1.query方式传参和接受参数 this.$router.push({ path:'/xxx' query:{ idname:id } }) 接收的方式：this.$route.query.id 2.params方式传递参数 this.$router.push({ name:'路径名称' query:{ idname:id } }) 接收的方式：this.$route.params.id 代码 this.$router.push({ path: '/container', params: { url: this.func.u
$router.push 不生效的问题
最新发布
滴水石穿
07-14 275
本问题的发生和解决显示，vue代码在执行路由操作时，不是同步阻塞型的，而是异步非阻塞型。即调用 this.$router.push 代码后，一方面开始准备跳转，同时代码也继续向下执行，一旦二者有路由冲突，那么结果就是难以预料的了。
vue路由this.$router.push跳转传参时，页面刷新会出现undefined的问题
qq_40685439的博客
03-26 6128
一般来说。利用this.$router.push进行页面跳转时，如果传递的参数为对象（图片中data为对象）时，不能直接传，而是需要把对象经过JSON.stringify转为字符串，取数据的时候需要用JSON.parse解析出来，刷新的时候才不会出现undefined。 注意： 1、经过测试，此方法只对以query形式传参时才会起效果，params不行。 2、params传参，push里面只能是 name:‘xxxx’,不能是path:’/xxx’, 否则拿到的数据是undefined。因为params只.
vue中this.$router.push()通过Param传参错误
weixin_56861492的博客
08-20 2496
vue中this.$router.push()通过Param传参错误
this.$router.push 提示错误 Cannot read property ‘push‘of undefined
zilvzsy的博客
06-30 3853
记笔记，免忘记！方便自己后续查阅！ 问题如下图： 因为我这里是等待两个请求请求完成后再执行跳转方法，所以代码如下： setTimeout(function(){ localStorage.removeItem('taskQuery'); this.$router.push({path:'/configure'}) },1000) 但是运行之后，报错..
vue中路由参数传递可能会遇到的坑
08-28
使用编程导航进行路由跳转时，我们可以使用 `$router.push` 方法来传递参数。例如： ```javascript this.$router.push({ path: '/b', params: { paramA: 'a' }, query: { paramB: 'b' }}) ``` 路由参数传递的坑 在...
详解vue-router传参的两种方式
10-18
在传递参数时，使用 `this.$router.push()` 方法，并指定 `name` 属性，因为 `params` 只能在通过路由名称引用时传递。例如： ```javascript this.$router.push({ name: 'openAccount', params: { id: id } }); ...
解决vue.js this.$router.push无效的问题
10-18
今天小编就为大家分享一篇解决vue.js this.$router.push无效的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
使用this.$router.push('')的方法进行路由跳转，提示'$router' of undefined问题
weixin_34357962的博客
11-21 1213
转载于:https://www.cnblogs.com/guoshuli/p/9995660.html
vue.js this.$router.push无效解决
热门推荐
gang456789的博客
09-16 3万+
login() { if(this.email.length > 0 && this.password.length >0) { this.$http.post('/api/login', { user: this.email, password: this.password
使用$router.push()方法进行传值时显示undefined
m0_73956769的博客
12-07 670
使用$router.push()方法进行传值时显示undefined
vue在请求拦截中,this.$router.push跳转报Cannot read property ‘$router‘ of undefined
m0_50278775的博客
03-24 4151
场景是这样的，当用户进来时，在请求拦截中判断token/ticket（这里我们项目用的是ticket）是否过期，过期的话就跳转到登录页面。 请求拦截是这样的，红框就是我用来跳转到登录页面的 然后就报Cannot read property '$router' of undefined 网上我查到的都是说是this指向问题，但是我看我代码的方法都是用es6的箭头函数，应该不存在this指向问题，不过实在想不出为什么，我就死马当活马医，var that = this; but 还是报错Cannot r
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。然后像下面这样写，就可以实现了。
this.$router.push提示'push' of undefined
09-14
这个错误提示表明在使用`this.$router.push`时，`$router`对象未定义。这通常是因为你在组件中没有正确引入或注册Vue Router。 确保你已经正确安装并引入了Vue Router，并且在根组件中进行了注册。在你的根组件中，你需要使用`Vue.use(Router)`来注册Vue Router插件。 另外，请确保你在使用`this.$router.push`前已经创建了Vue Router实例，并将其传递给Vue实例的`router`选项。例如，在创建Vue实例时，可以使用以下代码来创建和传递一个Vue Router实例： ```javascript import Vue from 'vue' import Router from 'vue-router' // 引入和定义你的路由配置 import routes from './routes' Vue.use(Router) const router = new Router({ routes // 路由配置 }) new Vue({ el: '#app', router, // 将路由实例传递给Vue实例的router选项 render: h => h(App) }) ``` 确保以上步骤都正确执行后，你就可以在组件中使用`this.$router.push`来进行路由导航了。如果问题仍然存在，请检查你的代码，确保没有其他错误导致`$router`对象未定义。
评论 6
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值