描述:众所周知,后台列表页一般会有筛选块(包含日期筛选框、关键词输入框、搜索按钮)、el-table 表格块、el-pagination 分页块,当获取列表接口数据时,会做些什么处理呢?
方式:取列表接口数据时,设置 isLoading="true"
, v-loading="isLoading"
应用在表格块、分页块增加 loading 遮罩不让显示,给搜索按钮加上 :loading="isLoading"
菊花样式不让再次搜索
缺点:如果获取接口数据的等待时间过长,比如筛选日期范围过大导致过慢,用户就想把日期范围缩小点加快数据的查看,这时候就只能等待了
方式:参考了神策网站里的事件分析接口,没有搜索按钮,可以随时改变事件类型、日期范围,一旦一个参数改变就发送新请求,丢弃掉旧请求 xhr.abort()
,同时再发送一个取消请求告诉后端不用去处理旧的请求了请求 network 截图
缺点:前后端需要额外处理下;本身请求接口就是耗时长的,需要耐心等待,不想用户那么频繁请求
那么,大佬们一般是怎么处理的呢?