[Vue warn]: Error in nextTick: "TypeError: Converting circular structure to JSON
--> starting at object with constructor 'Vue'
| property '$options' -> object with constructor 'Object'
| property 'router' -> object with constructor 'VueRouter'
--- property 'app' closes the circle"
一般报错TypeError: Converting circular structure to JSON是因为存在循环引用，并且使用JSON.stringify方法去转化成字符串。下面举一个简单地例子：
-
报错代码
const x = { a: 8 };
const b = { x };
b.y = b; // 循环引用
JSON.stringify(b); // 触发报错
-
解决
const x = { a: 8 };
const b = { x };
b.y = JSON.parse(JSON.stringify(b)); // 隐式深拷贝，主要实现深拷贝，解除循环引用
JSON.stringify(b);
也可以不使用深拷贝，直接去掉循环引用的代码，问题的关键点是解除循环引用
-
本博文报错位置不能显式看到循环引用，因为循环引用的代码不是自己写的，而是框架代码自己实现的，因此发现问题的产生地方更难一点。经过大约一下午时间头都快爆炸了，终于看到了黎明曙光。发现产生问题的原因：
vuex中的状态管理state中存储了router实例（组件中获取的this.$route），存在循环引用vuex使用了插件vuex-persistedstate
state中有了循环引用，插件vuex-persistedstate要执行JSON.stringify把state数据转化成字符串然后存储到浏览器本地存储。
接下来就是解决，那就是解除循环引用，解除办法就是对组件中获取的this.$route进行深拷贝，然后再存储到state。
/**
* 获取数据类型
* @param {All} [o] 需要检测的数据
* @returns {String}
export function getType(o){
return Object.prototype.toString.call(o).slice(8,-1);
* 判断是否是指定数据类型
* @param {All} [o] 需要检测的数据
* @param {String} [type] 数据类型
* @returns {Boolean}
export function isKeyType(o, type) {
return getType(o).toLowerCase() === type.toLowerCase();
* 深拷贝，支持常见类型 object Date Array等引用类型
* @param {Any} sth
* @return {Any}
export function deepClone(sth) {
let copy;
if (null == sth || "object" != typeof sth) return sth;
if (isKeyType(sth, 'date')) {
copy = new Date();
copy.setTime(sth.getTime());
return copy;
if (isKeyType(sth, 'array')) {
copy = [];
for (let i = 0, len = sth.length; i < len; i++) {
copy[i] = deepClone(sth[i]);
return copy;
if (isKeyType(sth, 'object')) {
copy = {};
for (let attr in sth) {
if (sth.hasOwnProperty(attr)) copy[attr] = deepClone(sth[attr]);
return copy;
return null;
深拷贝源码此项目包含很多前端通用方法。
报错：[Vue warn]: Error in nextTick: "TypeError: Converting circular structure to JSON --> starting at object with constructor 'Vue' | property '$options' -> object with constructor 'O...
在使用JSON.stringify方法去转化成字符串，会报错TypeError: Converting circular structure to JSON
原因： 对象中有对自身的循环引用；
let test = { a: 1, b: 2 };
test.c = test; // 循环引用
JSON.stringify(test); // 报错
解决方法：
下面的 json_str 就是JSON.stringify 转换后的字符串
var cache = [];
var json_str =
Converting c
ircular structure to
JSON 这个问题是因为对象嵌套深度超过系统，一般都是对象相互
引用
json转译为字符串，就一直
循环下去。
这个是因为js对
json对象赋值其实是地址的复制，就会导致这个问题
当然，如果不注意对象的操作，还可能会导致，删除等误操作。
今天把最近一直在开发的小程序放安卓手机上测试一下，结果某个页面就一直报错： Uncaught TypeError: Converting circular structure to JSON
先说一下基本的环境：
系统：Android 6.0.1
手机：小米4
微信版本：6.6.6
小程序基于mpvue开发
在看到这个错误的时候，明白导致的原因应该是因为一个对象里面有循环引用，然后这个对象不幸的被JSON.stringify给调用了
可是这个有循环引用的对象在哪就不清楚了。
一开始想的是vue对象的data，因为小程序里面，jscore会把这个data stringify之后发送给webvie
在调整loss计算的时候遇到了TypeError: only integer tensors of a single element can be converted to an index这个问题，原来的计算公式为：
self.loss_D = (self.loss_D_fake + self.loss_D_real) * 0.5
调整后的公式为：
# train.lcf[train.lcfCountD]为修正系数
self.loss_D = (self.loss_D_fake + self.loss_D_real) * 0.5 * train.lcf[train.lcfCountD]
1.业务需求：
vue项目使用el-tree组件时需要将树形的某一个node对象存储起来，存储的时候需要使用JSON对象来转换为字符串的形式，此时出现Converting circular structure to JSON报错，JSON转换失败。
2.解决方案：
在网上查找了资料，这个错误其实是因为被JSON转化的对象里的子项存在循环引用，JSON转化时其实也是一个深度拷贝的过程，但是存在循环引用的对象，
首先放上报错内容
TypeError: Converting circular structure to JSON
–> starting at object with constructor ‘Object’
— property ‘_renderProxy’ closes the circle
（想标红的，但是不会）
然后说下我的报错的位置
我是想在路由里将路由的信息存到vuex里，代码...
这种报错一般是数据处理的问题。比如：
我想在代码中把某个数组对象转换为Json字符串
JSON.stringify(this.$store.state.tagsView.visitedViews)
该数组对象的数据结构为：
这样转换就会造成“TypeError: Converting circular structure to JSON”报错。
但其实在需求中我只用到path字段的信息，所以应该处理完再转化为json字符串：
const visitedViews_temp = this.$store.s
TypeError: 动态导入模块失败：
这个错误通常是由于 JavaScript 代码中的动态导入语句（例如 import()）无法正确加载所需的模块而引起的。可能的原因包括网络连接问题、模块路径错误或模块本身存在问题。
要解决此问题，您可以尝试以下步骤：
1. 检查网络连接是否正常，确保您的计算机可以访问所需的模块。
2. 检查动态导入语句中的模块路径是否正确。您可以尝试使用绝对路径或相对路径来加载模块。
3. 如果模块本身存在问题，则可能需要修复模块或使用其他模块来替换它。
希望这可以帮助您解决问题！
