/** * @Description: 供应商选择 * @author xioln * @date 2023-06-16 */ <template> <div class="supplierSelect-com"> <el-autocomplete v-model="value" :fetch-suggestions="querySearch" placeholder="请输入内容" @select="handleSelect" > <template slot-scope="{ item }"> <div class="item">{{ item.value }}</div> </template> </el-autocomplete> </div> </template> <script> export default { componentName: '供应商选择', name: 'DxSupplierSelect', components: {}, data() { return { value: '', options: [ { value: '选项1' }, { value: '选项2' }, { value: '选项3' }, { value: '选项4' }, { value: '选项5' } ] } }, computed: {}, created() { // 初始化数据 }, methods: { querySearch(queryString, cb) { const results = queryString ? this.options.filter(this.createFilter(queryString)) : this.options cb(results) }, createFilter(queryString) { return (option) => { return option.value.toLowerCase().indexOf(queryString.toLowerCase()) !== -1 } }, handleSelect(item) { console.log(item) } } } </script> <style lang='scss'> </style>