uniapp的hpy-form-select组件添加搜索功能

uniapp中的`hpy-form-select`组件是一个表单下拉选择组件，用于在用户界面中提供一个可选择的下拉列表。要在该组件中添加搜索功能，通常需要使用`filter`属性来对选项进行过滤。以下是添加搜索功能的基本步骤：

1. 在数据中定义一个变量来保存搜索关键词，例如`searchKey`。
2. 绑定一个事件处理函数到`hpy-form-select`组件的`@input`事件，该事件会在用户输入时触发。
3. 在事件处理函数中，根据`searchKey`的值动态过滤`options`数据，只保留那些匹配搜索关键词的选项。
4. 将过滤后的结果传递给`hpy-form-select`组件的`options`属性，从而更新下拉列表中的选项。

示例代码如下：

<template>
  <view>
    <!-- 搜索框 -->
    <input type="text" placeholder="输入搜索关键词" v-model="searchKey" @input="filterOptions" />

    <!-- 下拉选择组件 -->
    <hpy-form-select :options="filteredOptions">
    </hpy-form-select>
  </view>
</template>

<script>
export default {
  data() {
    return {
      searchKey: '', // 搜索关键词
      options: [
        { label: '选项1', value: '1' },
        { label: '选项2', value: '2' },
        // ...更多选项
      ],
      filteredOptions: [] // 过滤后的选项
    };
  },
  methods: {
    filterOptions() {
      // 简单的搜索功能实现：过滤options中的数据
      const key = this.searchKey.trim().toLowerCase();
      this.filteredOptions = this.options.filter(item => item.label.toLowerCase().includes(key));
    }
  }
};
</script>

在上述代码中，我们在`<input>`标签中使用了`v-model`指令来双向绑定输入框的值到`searchKey`变量。每当用户输入时，`filterOptions`方法会被调用，它会根据`searchKey`的值过滤`options`，然后将结果赋值给`filteredOptions`，这个过程会实时更新`hpy-form-select`组件中显示的选项。