页面多个el-cascader，滚动卡顿

Question

页面中有使用多个el-cascader，滚动的时候el-cascader的弹框一直在回流，导致页面很卡，使用:append-to-body="false"仍然避免不了回流

Answer 1

该回答引用chatgpt:

如果您在使用多个 el-cascader 组件时遇到了性能问题，可以尝试以下优化措施：

减少渲染节点数：在 el-cascader 组件的选项数据中，只渲染当前可见区域的节点，而不是全部节点。这可以通过将 lazy 属性设置为 true 来实现。此外，还可以通过对选项数据进行分页来减少渲染节点数。
节流滚动事件：在滚动事件处理程序中使用节流函数，以减少事件处理的次数。可以使用 lodash 库中的 throttle 函数来实现。
使用虚拟滚动：在滚动容器中使用虚拟滚动，以减少渲染节点数。可以使用 vue-virtual-scroll-list 库来实现。
如果以上措施无法解决性能问题，您可能需要考虑使用其他组件或自行编写组件来替代 el-cascader 组件。