优维低代码实践：搜索功能

本文介绍: 在之前的示例中，我们有直接对接后端数据、通过事件进行接口的翻页数据请求等，但是在实际操作过程中，面对大量的数据，如果通过一页一页的翻阅查找，不方便且浪费时间，那么就会有搜索的功能要求，比如单字段的搜索，多字段的且、或搜索等。更改 c on text中的请求内容，通过que ry.q或其他推送到url上的参数，进行或、并的匹配操作，从而达到动态获取用户输入的信息，并在页面刷新时，自动将搜索内容作为入参，调用后端接口匹配符合的数据并返回给前端渲染。修改输入框的事件内容。添加搜索框构件后，修改搜索框的属性。

优维低代码技术专栏，是一个全新的、技术为主的专栏，由优维技术委员会成员执笔，基于优维7年低代码技术研发及运维成果，主要介绍低代码相关的技术原理及架构逻辑，目的是给广大运维人提供一个技术交流与学习的平台。

优维低代码实践连载第27期

《搜索功能（后端搜索对接）》

▽

在之前的示例中，我们有直接对接后端数据、通过事件进行接口的翻页数据请求等，但是在实际操作过程中，面对大量的数据，如果通过一页一页的翻阅查找，不方便且浪费时间，那么就会有搜索的功能要求，比如单字段的搜索，多字段的且、或搜索等。那接下来的示例将基于 cmdb搜索实例（
providers-of-cmdb.insta nce-api–post-searc h）接口，给大家介绍如何进行后端搜索功能。

placeholder: 请输入发布单元
shouldTrimQuery: true
shouldUpdateUrlParams: false
q: <% QUERY.q %&gt;

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