vue el-select 中 v-model 綁定的值以及如何進行回顯


<el-select v-model="categorySelect" value-key="category_id" style="width:300px; height:32px !important;font-size:12px">
<el-option
v-for="item in cats"
:key="item.category_id"
:label="item.category_name"
:value="item">
</el-option>
</el-select>

:value對應的值是v-model綁定的值,item此時是個對象,因此在取用選中這個對象中的其他數據的時候會非常方便。

value-ley中綁定的屬性名對應着:key中的屬性名,回顯對象中的  {value-key綁定的屬性值 = :key中綁定的對象的值},即可回顯成功   value-key 中的名稱需和:key值保持一致

categorySelect: {category_id: 12, category_name: "奶茶"},

 

列表頁點編輯按鈕時 賦值:

editGoods: function(index) {
var that = this;

that.shopgoods = that.itemsList[index];

// that.categorySelect = {category_id:13, category_name:'雞尾酒'};

that.categorySelect = {category_id:parseInt(that.itemsList[index].category_id), category_name:that.itemsList[index].category_name};

},

編輯頁點保存時:

updateMallGoods(){

that.shopgoods.category_id = that.categorySelect.category_id;

}

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM