antd vue change事件传递多个参数+下拉菜单和选择器不同宽

1.传递value+页面参数

@change="handleChange($event,'123')"

2.传递选中的key+value或是选中的item

我用的是a-auto-complete,试验了用a-select也可以

就是在option里面,:value="JSON.stringify(d)"

然后在eval('(' + value + ')')转化就可以

 <a-auto-complete :allowClear="type=='customer'?true:false" :disabled="disabled" v-model="textVals" placeholder="请搜索"
    option-label-prop="value"
      :style="'width:'+selectWidth" :filter-option="false" @search="handleSearch" @change="handleChange($event)">
      <template slot="dataSource">
        <a-select-option v-for="d in dataList" :key="d.value" :value="JSON.stringify(d)">{{d.text}}</a-select-option>
      </template>
    </a-auto-complete>



handleSearch(e){
   let obj = eval('(' + e + ')');
}

3.labelInValue参数,确实可以在change事件里获取到key+value,但是有个问题,前端给后端的参数也得是key+value格式

4.客户有个需求下拉菜单和选择器不同宽

:dropdown-match-select-width="false"

不用设置CSS样式!!!

a-auto-complete 也好用,虽然a-auto-complete没有dropdown-match-select-width这个属性!!!

顺便记录下,现在在用a-auto-complete,感觉比较坑的就是,重复选择相同的选项会出现多余的空格,解决方案:<a-select-option>{{d.text}}</a-select-option>写在一行就可以。

  • 8
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值