如何解决layui下select组件大数据卡顿问题

如何解决layui下select组件大数据卡顿问题

事情是这样，前不久接手了一个老版本的项目，从询问过程中得知项目中使用的是layui框架，迫于无奈，只好硬接了。

随着开发有序进行，突然有一天，测试提出了个问题急匆匆的找上我，怎么回事啊，这个页面一进来就贼卡，有的电脑还突然崩溃，当前程序也卡住，风扇也是嗡嗡的叫个不停。听到这，我连忙安慰道：别着急，等我抽根烟找找问题就好了(其实内心是慌的)。

说重点。

经过一顿分析后得出结论。1. layui是老一套框架了，当看到vue即将成为主流之后，作者连夜跑路说不干了，好像是17还是18年就不干了。所以，细心的人也会在网上看到一些遗留的bug还在,emm…。2. layui官网不支持多选，要多选需要另外下载额外组件。3. layui select组件及其简单，当遇到大数据时就出现下拉卡顿问题。4. 不支持忽略大小写搜索。。

算了，不想说了。还是说怎么解决吧。

方案：
源码上去改不太现实，而且工作量很可能会很大，只能采用替代方案。经过一番查找和不断实践，总算手写了个selectM.js替代了。

效果：
满足业务需求，虚拟列表实现下拉、不卡顿、可自由设置是否忽略大小写搜索、单选多选自由切换、es6和es5写法同样支持，require方式引入。效果截图如下：

注：由于代码量实在太多且不宜上传，有需要的开发朋友可私言免费领取。