【轉】elementui 獲取el-options的value和label

有個需求是 獲取el-options的value和label 

看到這篇文章,特意copy過來

原文:vue elementUI el-select 同時獲取label 和 value 的值.

 

 

前端調用後端接口時,後端保存數據,有時需要前端提交select選擇的 lable(name)和 value(code),所以我們需要想辦法解決,怎麼同時獲取lable和value。 解決辦法: el-option 綁定value的時候,同時綁定lable和value(分隔符隔開自定義一下就行)。這樣 el-select v-model 綁定的最終值是 lable 和 value,我們在提交的時候,把v-model綁定的值(字符串),分割成數組。數組的下標0是lable,下標1是value。

<el-select v-model="selectValue" placeholder="請選擇" size="small">
            <el-option v-for="item in list"  :key="item.value" :label="item.lable" :value="`${item.lable}|${item.vaue}`">
            </el-option>
  </el-select>

在獲取的時候

let [lable,vaue] = this.selectValue.split('|') // es6 數組解構賦值

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章