vue路由传参传递对象
时间: 2023-08-26 18:18:35 浏览: 219
在Vue中,路由传参不能直接传递一个对象,需要先将对象转换成字符串,然后在接收的页面再将字符串转换回对象。在Vue3中,可以使用`useRoute`方法来接收路由参数,示例代码如下:
```javascript
import { useRoute } from "vue-router";
setup() {
const route = useRoute();
const data = JSON.parse(route.params.list);
}
```
而在Vue2中,可以通过`this.$route.params`来接收路由参数,示例代码如下:
```javascript
let data = this.$route.params.list;
data = JSON.parse(data);
```
需要注意的是,在传递参数的时候,需要使用`JSON.stringify()`方法将对象转换成字符串,在接收参数的时候使用`JSON.parse()`方法将字符串转换成对象。这样就可以成功传递和接收包含对象的参数了。引用<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* [Vue路由传参接收以及传参对象为对象时的解决方案](https://blog.csdn.net/qq_41131745/article/details/122595114)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
- *3* [Vue路由传参的方法和传递参数为对象时的问题](https://blog.csdn.net/djwhwj/article/details/127084673)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]
阅读全文
相关推荐

















