冉冉說
2022-06-09 10:25:44
我有一個簡單的選擇,我目前填充了來自 axios 響應對象的一個選項。問題是該currentName值來自初始調用,我希望這是該調用時的“選定”選項。但是,當我單擊選擇并打開選項時,我想實際使用來自新 axios 調用的不同值數組填充可用選項,該調用正在填充selectOptions數組。如何在觸發選擇時填充所選選項currentName但仍允許selectOptions成為可選選項?假設我有一個 onClick 選擇,使我的第二個 axios 調用并填充selectOptions<select class="firstLastNames linkBox"> <option>{{currentName}}</option></select>...return { currentName: '', selectOptions: []}
1 回答

MM們
TA貢獻1886條經驗 獲得超2個贊
你需要使用v-for并v-model做你想做的事。首先,您必須從selectOptions數組中填充選擇選項。在 html 中你可以這樣寫:
<select class="firstLastNames linkBox" v-model="currentName">
<option v-for="option in selectOptions" :value="option.id">{{option.text}}</option>
</select>
在selectOptions數組中,您可以有一個對象數組,例如:
return {
currentName: "",
selectOptions: [
{id: 0, text: "Name one"},
{id: 1, text: "Name two"}
]
}
這樣,您selectOption就是用戶可以從中選擇的選項以及currentName從選項中選擇的值。
您傳入id的值將currentName是您在此處傳遞時保留的值:value="option.id"
因此,如果用戶選擇“Name one”,則currentName值為0. 或者,如果用戶選擇“命名兩個”,則currentName值為1.
添加回答
舉報
0/150
提交
取消