Antd Pro 列表页 ProTable 自定义搜索字段 - ReactJS - 大象笔记
首页
关于我
哼哼
开发者福利
读书笔记
Antd Pro 列表页 ProTable 自定义搜索字段
更新日期: 2021-05-31 阅读次数: 6547
字数: 199
分类: ReactJS
搜索
例如，我想在 Antd Pro 列表页的查询区域去掉一些字段，不希望这些字段参与搜索。
参考 ProTable 组件的文档：
https://procomponents.ant.design/components/table
实际上在设置 columns 时，就可以通过 column 配置来设置一个字段是否可以被搜索。
代码示例
const columns: ProColumns<API.Article>[] = [
title: "标题",
dataIndex: "title",
valueType: 'text',
},
title: "创建时间",
dataIndex: 'CreatedAt',
valueType: 'dateTime',
search: false,
},
配置之后，搜索栏就保留了一个字段。
这样前端请求后台时，就只会带上 title 这一个参数，而不会再捎带上 CreatedAt 字段了。
http://127.0.0.1:8000/api/get-articles?current=1&pageSize=20&title=444
golang gin 后台的配置
var db = models.DB
if keyword, isExist := c.GetQuery("title"); isExist == true {
db = db.Where("title LIKE ?", fmt.Sprintf("%%%s%%", keyword))
db.Order("id desc").
Limit(limit).
Offset((page - 1) * limit).
Find(&items)
关于作者
我是来自山东烟台的一名开发者，有敢兴趣的话题，或者软件开发需求，欢迎加微信 zhongwei 聊聊，
查看更多联系方式。
相关文章
Antd Pro ProTable 表格按指定列排序
Ant Design dateTimeRange 组件 UTC 时间的时区问题
Ant Design Form Input 组件添加快捷按钮及点击事件
Ant Design Form 字段设置默认值
nginx 部署 antd pro 在非根目录报 404 错误
ant design 组件上传视频直传七牛云
Antd Pro 列表页 ProTable 自定义搜索字段 (AMP 版)
爱评论不评论
* 评论
* 称呼
Email
博客地址
发射
2261
日志
143
分类
18135420
浏览






相关笔记
reactjs
ant design pro V5 使用 umi request 拦截器为请求 header 加上 jwt token
Ant Design Form.Item 中使用 Select 组件默认值总是显示数字
Antd Form 一行多个 Form.Item 组件
去掉 Antd Design Pro V5 页面中的 Serati Ma 水印
Antd Pro 加入富文本编辑器
最新文章
开源对话机器人框架 Rasa 的安装
网站中嵌入 B 站视频，禁止 iframe 代码中的视频自动播放
yolov5 模型导入 Android 后编译的 apk 文件体积巨大
yolov5 pytorch mobile 模型导入 Android，实现图片目标检测
yolo v5 导出 Android 手机上可以运行的 TFLite 模型
随机文章
使用腾讯文档编辑商业合同
获取七牛云视频文件的基本信息及关键帧截图
百度搜索资源指数持续下跌
nginx 中禁用 css, js，图片等静态资源的日志记录
提升 Tmux 状态栏颜值
关于
阅读清单
头痛的问题清单
博客功能更新日志
热门文章 TOP 榜
孙心然语录
关于壹一的一切
购物清单
应用及工具
大象工具
统计人数小程序
Android 桌面记事 (Google Play)
垃圾评论来源 IP 大集合
股票价格波段计算器
项目报价计算器
人民币大写转换
骄傲地使用
阿里云服务器
NameSilo 域名注册
七牛 CDN
Laravel 5.5
Hedwi 邮件发送平台
回到页首
后台处理耗时: 0.038 秒
@2012-2023 大象笔记 sunzhongwei.com 版本: 1.0.24
山东省烟台市开发区制造
鲁ICP备13002606号-1