el-autocomplete照抄官网demo都不显示值的原因

首先官网的写法:

然后为了验证能不能用,我几乎完全复制它所有的内容了,还是没有加载出来

很多网上说的时数据参数要存在{"value"}值,可demo就是value的值啊,为何还是没有显示,直到我看的这个:element 自动搜索 el-autocomplete,不显示结果_扮老虎的猪的博客-CSDN博客

发现它的方法可用,就能实现。

<el-autocomplete style="width: 58%;"
				  v-model="search_text"
				  value-key="address"
				  :fetch-suggestions="search"
				  :trigger-on-focus="false"
				  placeholder="请输入内容"
				  size="small"
				></el-autocomplete>



search(querystring, callback){
    setTimeout(()=>{
	   const data = [{ "value": "三全鲜食(北新泾店)", "address": "长宁区新渔路144号" }]
	    callback(data)
    }, 1000)
}

后面发现问题还是出在:

loadAll()获取的数据上,具体原因没有了解,但是

所有不要用官网的demo中的loadAll()这些参数,自己赋值一个,或者发送接口请求,其他的没有变

querySearchAsync(queryString, cb) {
                 var _this=this;
                 axios.get('http://xxxx/xxxx/id=1234').then(function (response) {
                    console.log("response:", response.data);

                    if(response.data.code == 20000){
                        var restaurants = response.data.address;
                        var results = queryString ? restaurants.filter(_this.createStateFilter(queryString)) : restaurants;
                        setTimeout(()=>{
                            cb(results)
                        }, 1000)

                    }
            });
 
            },

扩展:

再html使用value-key=“address”是会限制address的内容,不是显示value的,但是搜索都是value的

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

测试狂人

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值