需求背景
微搭现版本数据列表组件自身是不带搜索功能的,想实现通过搜索查询数据的功能,可以利用单行输入框组件来实现相应功能。
实践步骤
1. 在编辑器中选择数据列表组件,并配置好相应的数据模型。
2. 选择单行输入组件,相应位置如下图大纲树所示,单行输入框的组件模板选择“搜索框”。
3. 在数据列表组件中配置数据筛选条件。
4. 添加数据列表筛选条件,其中条件值与单行输入框的值进行绑定,设置完成,单击右上方确定。
说明:
上图条件设置仅作为参考,可以根据实际业务场景设置筛选条件。
5. 预览效果,例如在搜索栏中输入“11”,可以看到相应的查询结果。
当搜索框输入的结果没有查询到相应的结果时: