Vue -- 项目报错整理(1):RangeError: Maximum call stack size exceeded

  这几天项目运行报了个错: Uncaught RangeError: Maximum call stack size exceeded,刚开始看到 "returnNodeParameter",以为是 "returnNodeParameter" 方法报错,但转眼看到后面 "Maximum call stack size exceeded",就明白了,这明显是 超过了最大堆栈量(堆栈溢出)

  Vue -- 项目报错整理(1):RangeError: Maximum call stack size exceeded_第1张图片

 

  堆栈溢出的产生是由于过多的函数调用,导致调用堆栈无法容纳这些调用的返回地址,一般容易在递归中产生。所以这种错误一般是在递归函数当中出现,结合报错提示中提到的 returnNodeParameter方法,查看 returnNodeParameter方法自身以及 returnNodeParameter内其他调用方法中是否存在递归函数调用。自己写的代码,那些是递归函数那些不是,心里都有数,既然明确了是递归函数的锅,那就从调用的递归函数中找原因就是。

  产生错误原因:问题原因很简单,在 if (temp[i].pid !== '0') 中将本该写成  this.selectedNodePid 误写成了 this.selectedNode,导致 this.selectedNodePid 在后续递归执行中一直得不到更新,永远是最开始调用的值,从而递归循环一直转不出来,导致无限循环,造成堆栈溢出。

  Vue -- 项目报错整理(1):RangeError: Maximum call stack size exceeded_第2张图片,错误原因如图所示。

  归根结底是参数和参数条件判断的错误导致递归函数一直循环递归调用,无法停止,从而只有在超出浏览器最大堆栈量(内存溢出)时,浏览器抛出错误才能停止。

你可能感兴趣的:(Vue -- 项目报错整理(1):RangeError: Maximum call stack size exceeded)