el-autocomplete组件的select方法和fetch-suggestion同时获取自定义传参和内部参数

html中代码:

<el-autocomplete
         v-model="state"
         :fetch-suggestions="querySearchAsync"
         placeholder="请输入名称"
         @select="handleSelect"
         @change="handle(items)"
         value-key="name"
         size="mini"
         :clearable="true"
         v-if="items.children.length > 10">
</e-autocomplete>

fetch-suggestions是内部函数,这样写的话只有内部参数queryString,cb
@select默认的参数是当前选中的对象

解决办法:

:fetch-suggestions="((queryString,cb)=>{querySearchAsync(queryString,cb,items)})"

items为自定义参数,这样就可以拿到自定义参数了,自定义参数的个数没有限制

@select="handleSelect(items,$event)"

items为自定义参数,$event为内部参数

methods中:

querySearchAsync(queryString, cb,items) {
    var restaurants = items.children;
    var results = queryString ? restaurants.filter(this.createStateFilter(queryString)) : restaurants;

    clearTimeout(this.timeout);
    this.timeout = setTimeout(() => {
      cb(results);
    }, 300 * Math.random());
},
 createStateFilter(queryString) {
    return (state) => {
      return (state.name.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
    };
 },
 handleSelect(item,items) {
   console.log(item);
   console.log(items);
 },
  • 1
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值