elementUI select組件value值注意事項

select組件的使用方式就不細說，可查看select組件使用方式

主要要說一下注意事項：
select組件能夠動態生成option選項，option選項綁定對應的文本值和value值。
有時候咱們發現 默認顯示的內容會顯示具體的value值而不是對應的文本，這種狀況緣由都是：
v-model綁定的值與option選項value值類型不符，
常規就是number與string

通用咱們會循環一個數組、對象生成option選項

1.簡單數組

const array1=[1,2,3]

<el-select v-model="seletValue">
   <el-option v-for="item in array1" :key="item" :value="item" :label="item">
   </el-option>
</el-select>

此時 option 的value 是number 類型，v-model綁定的seletValue也必須是number類型

2.對象數組

const arrayOptions=[{key:0,text:'a'},{key:0,text:'b'},{key:0,text:'c'}}]

<el-select v-model="seletValue">
  <el-option v-for="item in arrayOptions" :key="item.key" :value="item.key" :label="item.text">
  </el-option>
</el-select>

由於咱們用item.key做爲option的value，item.key 是json中的值，
此時 option的value是number類型，v-model綁定的seletValue也必須是number類型 例如 seletValue=1

3.對象

const options={0:'a',1:'b',2:'c',}

<el-select v-model="seletValue">
  <el-option v-for="(value,key) in  options" :key="key" :value="key" :label="item.value">
  </el-option>
</el-select>

由於在json對象的 鍵:值 結構中，鍵的都是string類型，這裏咱們把json的鍵做爲 option的value，
此時 option的value實際上是string 類型，v-model綁定的seletValue也必須是string類型 例如 seletValue='1'

若是提交接口的數據要求是number怎麼辦，只須要在提交數據以前轉換下Number(seletValue)就能夠了

遇到這種狀況能夠參照上述狀況檢查代碼調試