使用對象作為 Vue Select 選項

Question

我知道，Vue Select 文檔指定 options 應該是一個數組，但是有沒有辦法解決它？ 我想使用對象鍵作為值和對象值作為標簽。

我的數據：

obj: {
   value: 'en',
   options: {
     'ar': 'Arabic',
     'ast': 'Asturian',
     'en':' English'
   }
}

 <v-select                                       
       v-model="obj.value"
       :options="Object.keys(obj.options)"                                 
>

我知道我可以這樣使用鍵作為選項，但我不知道如何使用值作為標簽。 有小費嗎？

Answer 1

有多種方法可以做到這一點，但一種選擇是：

<v-select v-model="obj.value" :options="obj.options" :reduce="val => val.code"/>

對您的數據的唯一更改應該是 obj.options 應如下所示：

obj: {
    value: "en",
    options: [
      { label: "Arabic", code: "ar" },
      { label: "Asturian", code: "ast" },
      { label: "English", code: "en" }
    ]
  }

相關文檔轉換選擇