vue前端接受后端返回body内数据再送给下一个页面时alert显示[Object object]

问题描述

前端接受后端返回数据时，是以json形式，Object格式。
前端在this.$axios.post('/api',this.$qs.stringfy({......})).then(response =>{...})发送请求，接受response之后处理数据时，可以通过result.data.method直接取到YY01，也可以result.data.body取到{"a":"xxx","b":"yyy"}，
在用this.$router.push(name:'/api2',params:{body:result.data.body})往下一个页面送body内的参数，下一个页面不能this.$router.params.body.a取到body内a的值xxx，显示[Object object]，但console.log是可以输出的

---

原因分析：

观察截图可知，result、data都是Object类型，所以可以直接点出里面的参数
而body并不是object，是字符串string类型的，所以不能直接点出body内的参数a

---

解决方案：

//接受body时进行格式转换，转换成Object类型
var homebody = JSON.parse(this.$router.params.data.body);
//再次使用homebody.a即可alert出body内的a对应值xxx

这一步可以在下一个页面执行JSON.parse(this.$router.params.data.body);
或者在前一个页面接收到后端返回时先进行JSON.parse(result.data.body);后再传给下个页面