原文:Element-ui 下拉列表 选项过多时如何解决卡顿问题

当使用Select选择器时,如果下拉列表有几千个几万个,因此通过滚动条一个个的去找不是很现实, 这时可以对select设置filterable属性,可以在下拉控件里进行搜索。例如: 体验的过程中还是会感觉明显的卡顿现象,问题和上面一样,还是因为下拉列表太多了,这时我们可以通过Select控件的filter method方法来自定义一个搜索方法,限制下拉数据只有有限制的条数。操作如下: ...

2020-03-17 23:03 0 2552 推荐指数:

查看详情

Element-ui 下拉列表 选项过多时通过自定义搜索来解决问题

当使用Select选择器时,如果下拉列表的数据量太多,会有一个明显的体验,例如: writer by:大沙漠 QQ:22969969 例子里我们用options模拟大量的下拉数据,渲染如下: 由于下拉列表有几千个,因此通过滚动条一个个的去找不是很现实的, 我们设置 ...

Fri Nov 29 02:31:00 CST 2019 1 1016
解决element-ui下拉框数据过多,导致页面问题与本地分页功能实现

效果 前情提要: 最近使用element-ui开发的一个页面,在打开的时候占用cpu非常高,有时候都能达到90%↑。在调试时发现其中一个下拉框的接口返回2k↑的数据。本着有问题问百度的精神,看到主要的解决方案有如下两种: 监听下拉框滚动事件,去服务端请求数据 https ...

Tue Mar 30 18:28:00 CST 2021 0 512
巧妙解决element-ui下拉框选项过多问题

1. 场景描述 不知道你有没有这样的经历,下拉框的选项很多,上万个选项甚至更多,这个时候如果全部把数据放到下拉框中渲染出来,浏览器会卡死,体验会特别不好 用人会说element-ui的select有一个remote-method,支持远程搜索,我们让服务端支持一下不就可以了,当然这是一种解决 ...

Wed Jul 31 01:32:00 CST 2019 0 6359
巧妙解决element-ui下拉框选项过多问题

1. 场景描述 不知道你有没有这样的经历,下拉框的选项很多,上万个选项甚至更多,这个时候如果全部把数据放到下拉框中渲染出来,浏览器会卡死,体验会特别不好 用人会说element-ui的select有一个remote-method,支持远程搜索,我们让服务端支持一下不就可以了,当然这是一种解决 ...

Tue Jul 09 03:47:00 CST 2019 0 531
解决AutoComplete数据过多时问题

如下代码,data数据超过2千条时,每次输入字符过滤时非常 其原因: 每次输入变化,data就要从2000多条数据中过滤出目标元素,一过滤就导致AutoComplete下拉列表得变化,浏览器得重新绘制下拉列表的Dom,导致浏览器 解决办法一 采用防抖函数,在间隔时间内,连续 ...

Mon Apr 15 19:28:00 CST 2019 0 514
Element-ui 下拉列表 全选 多选时 select全选 新增一个选择所有的选项

项目里经常会用到,在一个多选下拉框里新增一个选择所有的选项,例如: 渲染如下: 此时可以多选,如果想要选择所有选项时,得一个个去点击,这样不是很方便,我们可以在下拉框里新增一个选择所有的选项,通过watch用几行代码就可以实现与其它选项的互斥来实现一键多选 ...

Tue Aug 06 15:33:00 CST 2019 7 8086
VUE element-ui下拉列表获取label值

有这样一个场景,当我们往后台数据传的是id时,我们却想在前台获取列表显示的值,这时候可以用下面的方法来获取你想要的label值 value是选择的id值,obj里就是获取到的label值 ...

Thu Jun 06 21:56:00 CST 2019 0 2853
 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM