el-autocomplete 使用 --模糊查询

        <el-form-item label="工序">
            <el-autocomplete placeholder="请输入工序名称"
                             v-model="searchForm.process"
                             class="inline-input"
                             :fetch-suggestions="querySearch"
                             :select="handlename"
                             :debounce="10"
                             :popper-append-to-body="false"
                             :trigger-on-focus="true">

            </el-autocomplete>
        </el-form-item>

 querySearch(queryString, callback) {
            // console.log(queryString);
            var list = [];
            if (queryString && queryString.length > 0) {
                list = this.processNodeList.map(item => {
                    return {
                        id: `${item.id}`,
                        value: `${item.process_node_name}` //注意必须要用value,不然下拉框显示空白
                    }
                })
                var list2 = list.filter(p => p.value.indexOf(queryString) > -1);
                callback(list2);
            }
            else {
                list = this.processNodeList.slice(0, 10).map(item => {
                    return {
                        id: `${item.id}`,
                        value: `${item.process_node_name}`
                    }
                });
              
                callback(list);
            }

        },
        handlename(item) {
            console.log("item", item);
        },

<!-- el-autocomplete 宽度自适应 如果无效，加/deep/ -->
        .el-popper[x-placement^=bottom] {
            width: auto !important;
        }