admin管理员组文章数量:1568718
首先放上报错内容
TypeError: Converting circular structure to JSON
–> starting at object with constructor ‘Object’
— property ‘_renderProxy’ closes the circle
(想标红的,但是不会)
然后说下我的报错的位置
我是想在路由里将路由的信息存到vuex里,代码如下
import store from '@/store';
router.beforeEach((to, from, next) => {
// 设置路由数据
let arr = to.matched;
store.commit("setNav", arr);
next();
});
没错就是这里出了问题
再来说下报错的原因
类型错误:将循环结构转换为JSON
上面是翻译,大概意思是说什么循环嵌套。我就直接理解为占用吧(我这只是方便理解别当真,详细原因可以自行百度,大神们解释的清楚的多)。
知道原因就好办了下面就来解决
(请直接翻到最后,这些是个傻子的操作不用管,当然原理是没错的)
router.beforeEach((to, from, next) => {
// 设置路由数据
let arr1 = to.matched;
let arr2 = [];
for (let i = 0; i < arr1.length; i++) {
arr2[i] = arr1[i];
};
store.commit("setNav", arr2);
next();
});
这是我的第二版,没错依然失败了
原因呢arr1的数据格式是这样的
[
{...},
{...},
{...},
...
]
它是一个数组,数组里是对象,我上面的做法只是还是没有完全复制一个新的出来
这就涉及到变量赋值的问题了,数组和对象都是引用传递
最后完全复制一个就能够解决
router.beforeEach((to, from, next) => {
// 设置路由数据
let arr1 = to.matched;
let arr2 = [];
for (let i = 0; i < arr1.length; i++) {
arr2[i] = { path: null, name: null };
arr2[i].path = arr1[i].path;
arr2[i].name = arr1[i].name;
};
store.commit("setNav", arr2);
next();
});
时隔几个月我又来更新了,我发现当时我就是个傻子,明明一行代码解决的问题…
router.beforeEach((to, from, next) => {
// 设置路由数据
const arr1 = to.matched;
const arr2 = JSON.parse(JSON.stringify(arr1));
store.commit("setNav", arr2);
next();
});
这就好了,原理就是把数组或对象转化成JSON(当字符串吧),然后再转回来,就成了一个新的了。。。
本文标签: 报错路由TypeErrorvueconverting
版权声明:本文标题:vue 路由里关于 TypeError: Converting circular structure to JSON 报错问题 内容由热心网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:https://www.elefans.com/xitong/1725841437a1045040.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论