当前位置: 首页 > news >正文

buildadmin+tp8表格操作(5)自定义组装搜索的查询

有时候我们会自定义组装一些数据,发送给后端,让后端来进行筛选,这里有一个示例

const onComSearchIdEq = () => {// 展开公共搜索baTable.table.showComSearch = true/*** 公共搜索表单赋值* 范围搜索有两个输入框,输入框绑定变量分别为 `字段名-start` 和 `字段名-end`* 当前是范围搜索的等于示例,所以 start 和 end 均为1*/baTable.comSearch.form = Object.assign(baTable.comSearch.form, {'id-start': 1,'id-end': 1,})/*** 组装发送给服务端的筛选条件数据*/const fieldDataTemp = baTable.comSearch.fieldData.get('id') // 获取 id 字段的公共搜索数据,它由 baTable 自动初始化if (fieldDataTemp) {// 筛选数据组装let comSearchData: comSearchData = {field: 'id', // 筛选字段val: '1,1', // 范围查询的 start 值和 end 值,直接使用逗号分隔operator: fieldDataTemp.operator, // 公共搜索操作符号render: fieldDataTemp.render, // 字段渲染方案}let index = getArrayKey(baTable.table.filter!.search!, 'field', 'id') // 查询是否已经有 id 字段的筛选数据if (!index) {// push 到要发送给服务端的筛选条件数组中baTable.table.filter!.search!.push(comSearchData) // 无则 push} else {baTable.table.filter!.search![index] = comSearchData // 有则重新赋值}// 重新请求表格数据(刷新表格)baTable.onTableHeaderAction('refresh', {})} else {console.log('没有找到 id 字段的公共搜索数据,因为该字段禁止了公共搜索')}
}

从上面的代码中, 可以看到, 主要是组装了一个 comSearchData的数组,之后调用, baTable.onTableHeaderAction(‘refresh’,{}) 的方法刷新了一下表格就可以了。
为什么是这样就可以了
找到 refresh 方法, 调用了 getIndex()方法
在这里插入图片描述
找到index 的方法,这里有一个 this.table.filter
在这里插入图片描述
找到 filter ,可以看到 comSearchDAta 是在这里的,也就是说表格每一次刷新,都会使用搜索中的数据
在这里插入图片描述
所以, 我们更改了 comSearchData之后,直接刷新表格,就有效果了

http://www.lryc.cn/news/237471.html

相关文章:

  • 企业级固态硬盘如何稳定运行?永铭固液混合铝电解电容来帮忙
  • 【MISRA C 2012】Rule 4.2 不应该使用三连符
  • spring boot加mybatis puls实现,在新增/修改时,对某些字段进行处理,使用的@TableField()
  • 如何构建风险矩阵?3大注意事项
  • SpringSecurity5|12.实现RememberMe 及 实现原理分析
  • 持续集成交付CICD:Jenkins Sharedlibrary 共享库
  • Linux--网络编程
  • 数据结构 并查集
  • 算法通关村第十六关黄金挑战——求滑动窗口中的最大值(滑动窗口与堆方法、双端队列法和直接比较法)
  • 常见树种(贵州省):009楠木、樟木、桂木种类
  • 全志H616开发版
  • 【Spring boot】RedisTemplate中String、Hash、List设置过期时间
  • Nosql之redis概述及基本操作
  • 使ros1和ros2的bag一直互通
  • 【正点原子 linux 驱动编程】
  • 使用Python的turtle模块绘制玫瑰花图案(含详细Python代码与注释)
  • Redis学习笔记14:基于spring data redis及lua脚本ZSET有序集合实现环形结构案例及lua脚本如何发送到redis服务器
  • openssl C++研发之pem格式处理详解
  • 【教3妹学编辑-mysql】详解数据库三大范式
  • 【计算机网络笔记】路由算法之链路状态路由算法
  • 读像火箭科学家一样思考笔记04_第一性原理(下)
  • 开源集群管理系统对比分析:Kubernetes 与 Apache Mesos
  • matlab 坡度滤波算法地面分割
  • 【腾讯云 HAI域探秘】高性能服务器引领AI革新浪潮:从AI绘画、知识问答到PyTorch图像分类、视频检测的全方位探索
  • 【Java】ExcelWriter自适应宽度工具类(支持中文)
  • C++二分查找算法:132模式枚举3简洁版
  • Map 和 WeakMap:JavaScript 中的键值对集合
  • linux rsyslog综合实战1
  • redis+python 建立免费http-ip代理池;验证+留接口
  • 虚幻C++ day5