Vue中-下拉框可以选择可以填写

Love The Way You Lie 2023-01-07 03:52 96阅读 0赞

<el-form-item label="方法名称">
                                <el-autocomplete popper-class="my-autocomplete"
                                                 v-model="customForm.MethodName"
                                                 :fetch-suggestions="querySearchMethod"
                                                 placeholder="请输入方法名称"
                                                 :disabled="IsDisabled"
                                                 @select="((item)=>selectMethodChange(item))">
                                    <template slot-scope="{ item }">
                                        <div class="name">{
       { item.value }}</div>
                                    </template>
                                </el-autocomplete>
                            </el-form-item>
    
    // 方法
                querySearchMethod(queryString, cb) {
                    let that = this;
                    var solList = []
                    that.MethodOptionItems.forEach(item => {
                        solList.push({ 'label': item.value, 'value': item.label })
                    })
    
                    var results = queryString
                        ? solList.filter(this.createFilterMethod(queryString))
                        : solList;
                    // 调用 callback 返回建议列表的数据
                    cb(results);
                },
                createFilterMethod(queryString) {
                    let that = this;
                    var solList = that.MethodOptionItems;
                    return solList => {
                        return (
                            //solList.label.toLowerCase().indexOf(queryString.toLowerCase()) === 0
                            solList.label
                        );
                    };
                },
                handleSelectMethod(item) {
                    console.log(item);
                },