elementui select 选择器根据要求动态禁用选项

应用场景如下图所示:
在这里插入图片描述
1, 如图所示,我们经常需要用到在第一个选择器选中情况下,才可以启用第二个选择框,否则就是禁用状态
根据elementui select 选择器的 disabled 属性,我们可以进行绑定动态 disable 属性:

在这里插入图片描述
2,给定动态绑定disabled 属性默认值

  data() {
    return {
      showCmd:true,  //默认命令选择框是禁用的
    };
  },

3,当第一个选择框选中值后操作 disabled 的属性:

    getService(value){
      var result  = value.match(/\(([^)]*)\)/)[1];
      this.serrvice = result;
      // 如果第一个选择框有值,那么第二个选择框可选,否则禁用
      if(value.length>0){
        this.showCmd = false;
      }else{
        this.showCmd = true;
      }
    },

这样就可以实现简单的动态操作select 选择框禁用问题了!

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值