vue实现页面编程式跳转时 传对象形式 另个页面 怎么接受 对象
时间: 2024-03-20 13:40:41 浏览: 45
在Vue中,页面编程式跳转可以使用`$router.push()`方法来实现,如果需要传递对象,可以将对象作为参数传递给`$router.push()`方法。
下面是一个示例代码,演示了如何在页面之间传递对象:
在跳转时传递对象:
```
// 在 A 页面中跳转到 B 页面,并传递一个对象
this.$router.push({ name: 'B', params: { data: { name: 'John', age: 30 } } })
```
在接收页面中获取对象:
```
// 在 B 页面中通过 $route.params.data 获取传递过来的对象
export default {
name: 'B',
mounted() {
console.log(this.$route.params.data) // 输出 { name: 'John', age: 30 }
}
}
```
在接收页面中也可以使用计算属性来获取对象:
```
export default {
name: 'B',
computed: {
data() {
return this.$route.params.data
}
},
mounted() {
console.log(this.data) // 输出 { name: 'John', age: 30 }
}
}
```
需要注意的是,如果传递对象比较复杂,建议使用JSON字符串来传递,并在接收页面中解析JSON字符串。另外,如果需要在多个页面之间传递同一个对象,还可以考虑使用Vuex来管理全局状态。
阅读全文