這個不是我寫的,只是遇到的bug,寫法問題,忽略了值的綁定的問題
源代碼bug:
<el-selectv-model="schemeInfo.horizon"placeholder="請選擇起報月份"clearablefilterable><el-option v-for="(option,index) in horizonOptions" :key="index" :value="option.value">{{ option.label }}</el-option></el-select>
定義的數據:
這里的原來的string被我改成了Number,因為需要全等,不然就是顯示里面的值,而不是label
horizonOptions: [{ value: 0, label: '當年' },{ value: 1, label: '次年' }]
設置的默認值:
這里的?horizon: 0需要與上面的value為統一數據類型,也是數字
schemeInfo: {schemeName: '',statCode: '',target: '',initMonth: '',horizon: 0},
看以上感覺都是對的哈,數據類型也是對的全等,但是就是顯示不了中文
但是顯示為:
問題原因所在:
在?
el-option
?中,只綁定了?:value
?屬性,但沒有綁定?:label
?屬性當選中選項時,
el-select
?默認會顯示?value
?而不是?label
關鍵修改點:
在?
el-option
?上添加了?:label="option.label"
?屬性簡化了?
el-option
?的內容,不需要在標簽內再寫?{{ option.label }}
確保?
v-model
?綁定的?schemeInfo.horizon
?與?option.value
?類型一致(都是數字)
改后代碼:
<el-selectv-model="schemeInfo.horizon"placeholder="請選擇起報月份"clearablefilterable><el-optionv-for="(option, index) in horizonOptions":key="index":label="option.label":value="option.value"/></el-select>