Maximum call stack size exceeded报错的原因及解决办法

简介: Maximum call stack size exceeded报错的原因及解决办法


背景

在使用ElementUI的Select选择器,其中有一个可搜索的选择器,意思就是用户输入文字,选择器option选项可以模糊搜索(根据用户输入的文字推荐选项)

然后我给选择器的el-option根据数组 Options 进行遍历,该数组长度大概15万条,总之就是为了推荐选项更为精确,数组长度十分巨大

<el-select :value="whichSelect" filterable placeholder="请选择选项" @change="handleSelect">
  <el-option
    v-for="item in Options"
    :key="item.bankName"
    :label="item.bankName"
    :value="item.bankName"
  >
  </el-option>
</el-select>

然后本以为选项推荐功能可以美滋滋的使用了,结果浏览器甩出来了这么一个报错,意思是超出最大调用堆栈大小

解决办法

Maximum call stack size exceeded报错原因

Maximum call stack size exceeded,这是啥意思哇???网上说造成这个报错的场景,有的是由于router里面路径为声明,有的是未定义变量,有的由于是递归函数等等,实际上造成这样的报错,根本原因几乎都是递归太深,导致栈溢出

如何解决

然而,我的代码并没有递归函数啊,为何会造成这样的报错呢?这是因为ElementUI的select组件内部使用了递归,而我Options数组长度太大,造成了栈溢出。于是将Options数组长度减少到1000,不再报错,顺利解决了这样的问题。

在以后的编码,应该多注意,尽量少深层次递归,以及数组长度尽量控制长度不要太大。

如有遇到类似或其他的问题,欢迎探讨。

文章参考:

Maximum call stack size exceeded( 超出最大调用堆栈大小)

Maximum call stack size exceeded

‘Maximum call stack size exceeded’错误的解决方法

目录
相关文章
|
前端开发 JavaScript
【经典】全局公共scss文件的引入使用
【经典】全局公共scss文件的引入使用
|
iOS开发
uView的u-datetime-picker限制开始的年月日后ios显示不出来
uView的u-datetime-picker限制开始的年月日后ios显示不出来
698 0
|
JavaScript
Vue+element_Table树形数据与懒加载报错Error in render: “RangeError: Maximum call stack size exceeded“
本文讨论了在使用Vue和Element UI实现树形数据和懒加载时遇到的“Maximum call stack size exceeded”错误,指出问题的原因通常是因为数据中的唯一标识符`id`不唯一,导致递归渲染造成调用栈溢出。
1247 1
Vue+element_Table树形数据与懒加载报错Error in render: “RangeError: Maximum call stack size exceeded“
|
数据格式
使用小技巧实现el-table组件的合并行功能,ElementUI和ElementPlus都适用
本文介绍了在ElementUI和ElementPlus中使用`el-table`组件实现合并行功能的技巧,包括多列合并和单列合并的方法,并提供了相应的示例代码和运行效果。
10373 46
使用小技巧实现el-table组件的合并行功能,ElementUI和ElementPlus都适用
|
JavaScript 搜索推荐 前端开发
vue报错 ‘超出最大堆栈大小‘
vue报错 ‘超出最大堆栈大小‘
686 3
|
JSON 数据格式
解决报错TypeError: Converting circular structure to JSON --> starting at object with constructor
解决报错TypeError: Converting circular structure to JSON --> starting at object with constructor
|
JSON JavaScript 前端开发
vue前端运行时出现RangeError: Maximum call stack size exceeded
vue前端运行时出现RangeError: Maximum call stack size exceeded
1418 4
|
容器
echarts的grid——图表的位置配置
echarts的grid——图表的位置配置
2693 1
|
JavaScript UED
解决 Element-ui中 选择器(Select)因options 数据量大导致渲染慢、页面卡顿的问题
解决 Element-ui中 选择器(Select)因options 数据量大导致渲染慢、页面卡顿的问题
4806 0
解决 Element-ui中 选择器(Select)因options 数据量大导致渲染慢、页面卡顿的问题