ant design vue带有远程搜索,节流控制,请求时序控制,加载状态的下拉选择框a-select 与 a-select-option 踩坑,清除后placeholder不显示

<template>
  <a-select
    allowClear
    :value="value"
    @search="fetchData"
    @change="selectChange"
    :placeholder="holder"
    :not-found-content="fetching ? undefined : '暂无数据'"
    :filterOption="false"
    :getPopupContainer="triggerNode => triggerNode.parentNode"
    :showSearch="true"
    style="width: 100%"
  >
    <a-spin v-if="fetching" slot="notFoundContent" size="small"></a-spin>
    <a-select-option v-for="item in selectData" :key="item.key">{{ item.value }}</a-select-option>
  </a-select>
</template>
props: {
    value: {
      default: undefined
    },
  },
      
// 父组件:      
change(value) {
    this.form.userValue = value ? value.key : undefined;
}

Select props

  • value(v-model)

  • allowClear

    在点击×清除value后,placeholder不显示,原因是value的default没有设置成undefined,同时,点击×后,触发change方法,value值为undefined,再把绑定的value赋值为undefined才对。

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值