亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

Vue 選擇框,使用一個選項預選并使用來自不同 axios 調用的數組填充選項

Vue 選擇框,使用一個選項預選并使用來自不同 axios 調用的數組填充選項

冉冉說 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.


查看完整回答
反對 回復 2022-06-09
  • 1 回答
  • 0 關注
  • 154 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號