文档中心>腾讯云微搭低代码>实践教程>数据列表组件如何实现搜索功能

数据列表组件如何实现搜索功能

最近更新时间:2024-05-16 10:30:41

我的收藏

需求背景

微搭现版本数据列表组件自身是不带搜索功能的,想实现通过搜索查询数据的功能,可以利用单行输入框组件来实现相应功能。

实践步骤

1. 在编辑器中选择数据列表组件,并配置好相应的数据模型。



2. 选择单行输入组件,相应位置如下图大纲树所示,单行输入框的组件模板选择“搜索框”。



3. 在数据列表组件中配置数据筛选条件。



4. 添加数据列表筛选条件,其中条件值与单行输入框的值进行绑定,设置完成,单击右上方确定



说明:
上图条件设置仅作为参考,可以根据实际业务场景设置筛选条件。
5. 预览效果,例如在搜索栏中输入“11”,可以看到相应的查询结果。



当搜索框输入的结果没有查询到相应的结果时: