antd vue select下拉框設value沒有顯示對應title卻直接顯示出value值

可能的情況1：select拿到的value值沒有能對應的title

 

typeList=[ {"alias1": "虛擬行政區域", "value1": "0" }, {"alias1": "行政區域", "value1": "1" }, {"alias1": "職能部門", "value1": "2" }, {"alias1": "專屬網格", "value1": "3" }, {"alias1": "科室", "value1": "4" }, {"alias1": "其他", "value1": "5" }, {"alias1": "企業、單位", "value1": "6" } ]

<a-select v-model="type" ref="select" allowClear
  :getPopupContainer="(triggerNode) => triggerNode.parentNode">
  <a-select-option v-for="(item, index) in typeList" :key="index" :value="item.value1">
    {{ item.alias1 }}
  </a-select-option>
</a-select>

當type="7"的時候，typeList中沒有對應的值，就會直接顯示7

 

---

 

可能的情況2：select綁定的值與數據源的類型不同，比如需要string型而不能夠是number型

可以看到上面的typeList中第二項對應的value是字符串'1'，若綁定a-select的值為1，將導致選擇器顯示為1，而不是"行政區域"。

 

 

若綁定值為'1'，則正常顯示。

 

 

 

 

參考：https://blog.csdn.net/wwppp987/article/details/112783531