fastadmin搜索刷新列表,怎么限制用户频繁点击?

文章目录

fastadmin搜索刷新列表,怎么限制用户频繁点击?

fastadmin目前有个很致命的问题,就是用户可以频繁的点击搜索等按钮,频繁请求刷新页面,如果你的数据比较多,查询比较慢时,系统会卡住甚至崩溃。

这个问题全网都没找到答案,于是决定自己写一个

解决方案

我的解决方案是加防抖代码,等待列表响完成才能再次点击查询

fastadmin事件方法

那要怎么获取用户什么时候点击,和数据响应完成了呢?

还好fastadmin开放了很多事件方法,你想要的基本都能从这里找的

https://doc.fastadmin.net/doc/194.html

看看我们可能用的上的事件

  • onLoadSuccess 远程数据加载成功时触发成功。
  • onCommonSearch 表格通用搜索提交前触发。
  • onRefresh 点击刷新按钮后触发。(实测其实点击通用搜索提交也会触发)

所以这里选择onRefresh和onLoadSuccess方法配合即可

实现

大致思路就是获取搜索提交按钮和刷新按钮,点击刷新或者搜索时禁用这两个按钮,等远程数据加载成功时再开启按钮

代码

javascript 复制代码
onRefresh: function () {
    console.log("点击刷新按钮/通用搜索后触发。");
    var submitButton = $('button[type="submit"]');
    var refreshButton = $('.btn-refresh');
    // 添加 disabled 禁用按钮
    submitButton.prop('disabled', true);
    refreshButton.prop('disabled', true);
},
onLoadSuccess: function () {
    console.log("远程数据加载成功时触发成功。");
    var submitButton = $('button[type="submit"]');
    var refreshButton = $('.btn-refresh');
    // 取消 disabled 禁用按钮
    submitButton.prop('disabled', false);
    refreshButton.prop('disabled', false);
},

注意代码放置的位置

当然这里自己写一个监听,当表格数据加载完成时调用的方法也可以

javascript 复制代码
//当表格数据加载完成时调用
table.on('load-success.bs.table', function (e,data){
	console.log("当表格数据加载完成时调用");
});

完结

赠人玫瑰,手有余香!如果文章内容对你有所帮助,请不要吝啬你的点赞评论和关注,你的每一次支持都是我不断创作的最大动力。当然如果你发现了文章中存在错误或者有更好的解决方法,也欢迎评论私信告诉我哦!

好了,我是向宇https://xiangyu.blog.csdn.net

一位在小公司默默奋斗的开发者,闲暇之余,边学习边记录分享,站在巨人的肩膀上,通过学习前辈们的经验总是会给我很多帮助和启发!如果你遇到任何问题,也欢迎你评论私信或者加群找我, 虽然有些问题我也不一定会,但是我会查阅各方资料,争取给出最好的建议,希望可以帮助更多想学编程的人,共勉~

相关推荐
懒大王爱吃狼1 小时前
Python教程:python枚举类定义和使用
开发语言·前端·javascript·python·python基础·python编程·python书籍
秃头佛爷2 小时前
Python学习大纲总结及注意事项
开发语言·python·学习
待磨的钝刨2 小时前
【格式化查看JSON文件】coco的json文件内容都在一行如何按照json格式查看
开发语言·javascript·json
XiaoLeisj4 小时前
【JavaEE初阶 — 多线程】单例模式 & 指令重排序问题
java·开发语言·java-ee
励志成为嵌入式工程师5 小时前
c语言简单编程练习9
c语言·开发语言·算法·vim
逐·風5 小时前
unity关于自定义渲染、内存管理、性能调优、复杂物理模拟、并行计算以及插件开发
前端·unity·c#
捕鲸叉5 小时前
创建线程时传递参数给线程
开发语言·c++·算法
Devil枫5 小时前
Vue 3 单元测试与E2E测试
前端·vue.js·单元测试
A charmer5 小时前
【C++】vector 类深度解析:探索动态数组的奥秘
开发语言·c++·算法
Peter_chq5 小时前
【操作系统】基于环形队列的生产消费模型
linux·c语言·开发语言·c++·后端