vue2中跳转页面post传参怎么做
时间: 2024-02-12 13:04:43 浏览: 23
在Vue2中跳转页面并传递POST参数可以使用Vue Router的编程式导航方式。具体步骤如下:
1. 在组件中引入Vue Router并获取路由实例:`import router from '@/router'`
2. 在触发跳转的方法中使用`router.push`方法实现跳转,并传递POST参数。例如:
```
this.$http.post('/api/user', {name: '张三', age: 18}).then(res => {
router.push({path: '/user', query: res.data})
})
```
其中,`router.push()`方法接受一个路由对象作为参数,可以设置跳转的路径、参数等信息。`query`参数表示要传递的参数,可以是对象或字符串等类型。
3. 在接收参数的组件中使用`this.$route.query`获取传递的参数。例如:
```
<template>
<div>
<p>{{name}}</p>
<p>{{age}}</p>
</div>
</template>
<script>
export default {
data() {
return {
name: '',
age: ''
}
},
mounted() {
this.name = this.$route.query.name
this.age = this.$route.query.age
}
}
</script>
```
在上面的例子中,我们在接收参数的组件中使用`mounted`钩子函数获取传递的参数,并将其赋值给组件的data属性。