uniapp多功能选择器组件，类似于elementui，可搜索可下拉可清空（基于uView二次封装），支持各端兼容，非常好用！！！

以下是一个基于uView UI框架的UniApp多功能选择器组件的简化示例代码：

<template>
  <view class="u-dropdown">
    <u-dropdown
      ref="dropdown"
      :list="options"
      @confirm="onConfirm"
      @cancel="onCancel"
    >
      <view class="dropdown-input" @tap="toggle">
        <input
          class="input-field"
          type="text"
          v-model="inputValue"
          placeholder="请选择或输入"
          @input="onInput"
        />
        <u-icon name="arrow-down" color="#909399" size="28"></u-icon>
      </view>
    </u-dropdown>
  </view>
</template>
 
<script>
export default {
  data() {
    return {
      inputValue: '',
      options: [
        // 填充你的选项数据
      ],
      // 其他数据状态...
    };
  },
  methods: {
    toggle() {
      this.$refs.dropdown.open();
    },
    onConfirm(value, index) {
      // 选择确认的回调
      this.inputValue = value;
    },
    onCancel() {
      // 取消选择的回调
    },
    onInput() {
      // 处理输入，筛选或更新options
    }
  }
};
</script>
 
<style scoped>
.dropdown-input {
  display: flex;
  align-items: center;
  padding: 0 15px;
  height: 40px;
  border: 1px solid #dcdfe6;
  border-radius: 4px;
  background-color: #fff;
}
.input-field {
  flex: 1;
  height: 38px;
  line-height: 38px;
  font-size: 16px;
}
</style>

这个示例提供了一个可搜索、可下拉的选择器组件，其中包含了一个可编辑的输入框和一个下拉箭头图标。用户可以点击输入框打开下拉菜单，也可以在输入框中搜索或直接输入选项。这个组件可以根据需求进一步完善，比如添加清空按钮、多选功能等。