美文网首页
select下拉框change传递多个属性

select下拉框change传递多个属性

作者: 指尖架构141319 | 来源:发表于2020-05-18 15:27 被阅读0次
    1.常规select option操作
    <el-select v-model="query.param.location" style="width:180px" 
            placeholder="please select" @change="changeCountry($event)">
             <el-option
               v-for="item in locations"
              :key="item.id"
              :label="item.location"
              :value="item.location">
      </el-option>
    </el-select>
    
    //js
    changeCountry(value){
       //此时的value为数组中的每个对象的一个属性location
    }
    
    2.change事件传递选中多个属性到js
    <el-select v-model="query.param.location" style="width:180px" 
            placeholder="please select" value-key="id" 
            @change="changeCountry($event)">
            <el-option
                v-for="item in locations"
                :key="item.id"
                :label="item.location"
                :value="item">
            </el-option>
    </el-select>
    
    //js
    changeCountry(value){
       //此时的value为选中数组的整个对象
    }
    

    修改地方:
    1.<el-select中增加固定写法value-key="id"
    2.<el-option中的:value改为item

    相关文章

      网友评论

          本文标题:select下拉框change传递多个属性

          本文链接:https://www.haomeiwen.com/subject/gfguohtx.html