Ant Design Vue省市级联实现只选择省的功能

ant design vue省市级联如果只选择省,可添加change-on-select属性

<a-cascader
          v-model:value="regionSelect"
          :options="regionSelectOptions"
          placeholder="请选择地区"
          change-on-select
          :getPopupContainer="(triggerNode:any)=> triggerNode.parentNode"
        />

但在省市展示那里需要处理一下,get里写两个三目运算符,否则省后面会多一个/

在这里插入图片描述

TS代码如下:

const regionSelect = computed({
    get() {
      return ecloudOrdersState.orderParams.provinceId
        ? ecloudOrdersState.orderParams.cityId
          ? [ecloudOrdersState.orderParams.provinceId, ecloudOrdersState.orderParams.cityId]
          : [ecloudOrdersState.orderParams.provinceId]
        : [];
    },
    set(val: string[]) {
      if (val) {
        ecloudOrdersState.orderParams.provinceId = val[0];
        ecloudOrdersState.orderParams.cityId = val[1];
      } else {
        ecloudOrdersState.orderParams.provinceId = '';
        ecloudOrdersState.orderParams.cityId = '';
      }
    }
  });

处理之后是这样

在这里插入图片描述

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值