最近遇到一个下拉框选项过多导致页面太卡甚至卡死的问题,搜了一下懒加载以及远程搜索方法,整理了一下: 1、el-select懒加载 el-select选择器里的数据通过后端返回得到,这里返回了将近两万条数据,点开选择器页面就特别卡,所以最好采用懒加载方法,具体使用如下: 控件部分: 数据 ...
原理:类似分页,设置高度,当超过一个高度再加载一页数据 在赋值的时候,可能当前的select值没有目标值,所以赋值时需要处理一下 ...
2021-08-29 18:28 0 200 推荐指数:
最近遇到一个下拉框选项过多导致页面太卡甚至卡死的问题,搜了一下懒加载以及远程搜索方法,整理了一下: 1、el-select懒加载 el-select选择器里的数据通过后端返回得到,这里返回了将近两万条数据,点开选择器页面就特别卡,所以最好采用懒加载方法,具体使用如下: 控件部分: 数据 ...
在实际开发中我们有时无法避免select下拉功能数据过大导致页面卡顿(如在我在一次迭代中有一个select项接口返回了5000多条数据)。用户体验差!结合实际开发给出了3个解决方案: 方案1、select的无限加载; 方案2、select的分段加载; 方案3、select的模糊 ...
给select下拉框添加属性 dropdownRender={menu => ( <div> ...
,就20条,偏偏还得做个分页器。(假设为10条) 此时,如果能够像购物商城那样拖拽到底部自动加载新数据就 ...
扩展select下拉框,(当数据过多的时候以弹出框的形式显示) */--> 扩展select下拉框,(当数据过多的时候以弹出框的形式显示) Table of Contents 问题描述: 解决方案 ...
第一种方法:添加分页,页面样式如下,JS逻辑与平常分页没区别 css 第二种方法:下拉加载更多 1.写一个指令 2.页面使用指令,添加远程搜索属性和方法 3.JS写逻辑 ...
组件内容: 组件使用: ...
getStorageList() { const url = "/api/basicInfo/base/storage/getLi ...