如何在 Vuetify 中使用 v-select 設置默認持有者

Question

我試圖為 v-select 設置占位符

<v-select
 item-value="id"
 item-text="name"
 :placeholder="holderValue"
 v-model="selectedDM"
 label="Chọn danh mục"
 :items="handleCate(item)"
 :disabled="status"   
>

我試圖推送一個臨時數組，但它仍然沒有工作

    handleCate (item) {
      if ( this.radioGroup == "2") {
        //this.holderValue = null
        // let temp = []
        // console.log('im item ', item)
        // this.listCategory.map(category => {
        //   console.log('im cate ', category)
        //   temp.push({name: category.name, id: ""})
        //   //return category.name
        // })
        // console.log('im temp ', temp)
        // return temp
        return this.listCategory.map(category => {
          return category.name
        })
        
      }
    }

我也嘗試過設置

this.holderValue = "Sth Sth"

但它仍然沒有工作任何幫助將不勝感激。 謝謝閱讀

Answer 1

讓我知道這是否有幫助。

模板

<v-select
  item-value="id"
  item-text="name"
  :placeholder="holderValue"
  v-model="selectedDM"
  :label="holderValue"
  :items="handleCate(item)"
  :disabled="status"   
/>

腳本

export default {
  data(){
    return {
      holderValue:'Sth Sth',
      selectedDM:'',
      listCategory:[{name:'Vue', id:1}, {name:'Angular',id: 2}, {name:'React',id:3}]
    }
  },
  async mounted(){
    // if fetching data from api
    // const data=await fetch('<api-url>').then(res=>res.json())
    // this.listCategory=data.map(d=>({name: d.name, id: d.id}))
  }
}