导语：优维低代码技术专栏，是一个全新的、技术为主的专栏，由优维技术委员会成员执笔，基于优维7年低代码技术研发及运维成果，主要介绍低代码相关的技术原理及架构逻辑，目的是给广大运维人提供一个技术交流与学习的平台。
优维低代码实践连载第27期
《搜索功能（后端搜索对接）》
▽
在之前的示例中，我们有直接对接后端数据、通过事件进行接口的翻页数据请求等，但是在实际操作过程中，面对大量的数据，如果通过一页一页的翻阅查找，不方便且浪费时间，那么就会有搜索的功能要求，比如单字段的搜索，多字段的且、或搜索等。那接下来的示例将基于cmdb搜索实例（providers-of-cmdb.instance-api-post-search）接口，给大家介绍如何进行后端搜索功能。 一、基于context数据源搜索 1.1 搜索框 添加搜索框构件后，修改搜索框的属性 修改输入框的事件内容。当输入框输入完搜索内容，被点击搜索时，将输入的内容以key:value的形式推送到url上，供后续页面刷新时，context的请求能够获取到搜索内容。 1.2 context数据源 更改context中的请求内容，通过query.q或其他推送到url上的参数，进行或、并的匹配操作，从而达到动态获取用户输入的信息，并在页面刷新时，自动将搜索内容作为入参，调用后端接口匹配符合的数据并返回给前端渲染。 provider: providers-of-cmdb.instance-api-post-search agrs: 1.3 前端输入搜索内容验证搜索结果 同理，下拉框的选择搜索与搜索框的输入搜索一致，将下拉框所选中的内容推送到url上，再在context中配置动态数据的获取；确定好搜索的内容的同级关系（并、或关系），使用$or\$and等mongoDB的查询语法进行配置。 PS：不同的接口所需的查询条件不一致，具体入参要根据接口文档内容来确定，但是整体的搜索逻辑是一样的。
placeholder: 请输入发布单元shouldTrimQuery: trueshouldUpdateUrlParams: falseq: <% QUERY.q %>
filter.update: action: history.pushQuery args: - q: <% EVENT.detail.query %> page: 1
- APP- fields: '*': 1 businesses.business_line.name: 1 businesses.business_line.product_line_user.departmentName: 1 businesses.business_line.product_line_user.name: 1 businesses.business_line.product_line_user.nickname: 1 businesses.name: 1 businesses.owner.departmentName: 1 businesses.owner.name: 1 businesses.owner.nickname: 1 releaseAbbreviation: 1 page: <% QUERY.page || 1 %> page_size: <% QUERY.pageSize || 8 %> query: $or: - releaseTimes: $like: '%${query.q}%' - releaseNum: $like: '%${query.q}%' - name: $like: '%${query.q}%' - releaseDate: $like: '%${query.q}%' businesses.business_line.instanceId: $eq: '${query.product_line}' businesses.instanceId: $eq: '${query.business}' releaseDate: $eq: '${query.releaseDate}' sort: ctime: 1
