vue element-ui el-transfer 获取选中值

本文介绍了在Vue项目中使用Element-UI的el-transfer组件时,如何获取用户选择的值。通过selectValue变量,可以方便地获取到用户在el-transfer组件中选定的数据。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

 templete
 <el-transfer
      filterable
      @left-check-change="leftCopeChane"
      :titles="['菜品', '已选菜品']"
      :filter-method="filterMethod"
      v-model="value"
      :props="{
        key: 'id',
        label: 'name'
       }"
      :data="dataList">
      <span slot-scope="{option}">{{option.name}}
        <span style="float: right;padding-right:10px;font-size: 10px;text-align: left">
          {{option.typeName==null?'':';'+option.typeName}}
          {{option.tasteName==null?'':';'+option.tasteName}}
          {{option.feelName==null?'':';'+option.feelName}}
          {{option.spicyName==null?'':';'+option.spicyName}}
        </span>
      </span>
    </el-transfer>

method:
    leftCopeChane(selecedOption) {
        if (selecedOption.length > this.selecedOption.length) {
          let selectValue = selecedOption.concat(this.selecedOption).filter(v => !selecedOption.includes(v) || !this.selecedOption.includes(v))
          alert(selecedOption + ' ' + this.selecedOption + '选中' + selectValue);
        }
        this.selecedOption = selecedOption;
      },

selectValue极为选中的值

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值