簡記一下關於Vue中el-select選擇器的值綁定和表單傳輸

首先要分清楚：el-select中 v-model綁定的是將要在表單中提交的值；

el-select中如果有多個選擇，

方案一列舉，按照官網案例：

方案二v-for循環遍歷：

場景如下：

待提交的表單中存在select選擇器，選擇的值要作為內容進行提交：

<el-form-item
　　label-width="110px"> <el-select v-model="ParamsObj.depart" placeholder="歸口部門選擇"> <el-option v-for="(dict,index) in mgeDepartStatusOptions" :key="index" :label="dict.descValue" :value="dict.code"/> </el-select> </el-form-item>

mgeDepartStatusOptions：[
　　　　{ "code": "測試",　　　　 //選中綁定的 "descValue": "測試" //顯示的值 }, { "code": "報表指標", "descValue": "報表指標" }, { "code": "收入分類", "descValue": "收入分類" },

]


ParamObj：{
　　depart:""
}

 

<el-form-item  label-width="110px">
  <el-select v-model="ParamsObj.depart" placeholder="歸口部門選擇">
    <el-option
v-for="(dict,index) in fromData2.mgeDepartStatusOptions"
:key="index"
:label="dict.descValue"
:value="dict.code"/>
  </el-select>
</el-form-item>