element 中自动补全输入框的注意事项

折腾了一晚上,总算全部弄出来了

element-puls

vue3

注意的问题有两个:

1. 初始的值必须为数组

2. cd返回results中数组的值必须含有value对象的值，没有这个值的话，输入框就不会显示。

代码如下：

         //定义自动补全参数

        let autocompleteclassname = ref('')
        let tempsearchdata = []


        // 自动补全函数
        const querySearch = (queryString, cb) => {
            //要匹配的值
            console.log(tempsearchdata);
            const results = queryString
                ? tempsearchdata.filter((item) => {
                    return item.value.indexOf(queryString) !== -1
                }) : tempsearchdata
            // // 调用 callback 返回建议列表的数据
            cb(results)
        }

        ///* 跳转并传值 */
        const handleSelect = (item) => {
            console.log(item)
        }


        //取得初始值，并将原先文本数组转换成对象数组，含value
        const getclassall = () => {
            proxy.$api.getclass(params.classname).then((result) => {
                datastest.classdatas = result.data
                result.data.map((e) => {
                    tempsearchdata.push({ value: e })
                })
            })
        }