如何使用axios

Question

我需要填充Vuetify选择，但是它有问题，我的Get方法返回数据，但vuetify select只显示如下：

文字显示有效数据：

[ { "id": 1 }, { "id": 2 } ]

要填充选择i，请按照文档添加:items="entidades" and :item-text="entidades.id" and :item-value="entidades.id"

<v-select :items="entidades" :item-text="entidades.id" :item-value="entidades.id" single-line auto prepend-icon="group_work" label="Seleccionar Grupo"></v-select>

这是我的代码表格脚本

`data() {
return(){
entidades: [{
          id: ''  
        }],
}
}`

我已经尝试过0，但结果相同。

我的axios.get方法。

    axios.get('http://localhost:58209/api/GetEntidades', {
      headers:{
       "Authorization": "Bearer "+localStorage.getItem('token')
          }
  })
    .then(response => { 
      console.log(response)
      this.entidades = response.data;
        })
        .catch(error => {
        console.log(error.response)
        });

非常感谢

Answer 1

item-text和item-value分别是每个项目将显示并用作值的属性的 名称 。所以使用item-text="id" item-value="id"：

<v-select :items="entidades" item-text="id" item-value="id" single-line auto prepend-icon="group_work" label="Seleccionar Grupo"></v-select>

演示：

new Vue({
  el: '#app',
  data () {
    return {
      entidades: [ { "id": 1 }, { "id": 2 } ]
    }
  }
})

<link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Material+Icons'>
<link rel='stylesheet' href='https://unpkg.com/vuetify@1.0.10/dist/vuetify.min.css'>
<script src='https://unpkg.com/vue/dist/vue.js'></script>
<script src='https://unpkg.com/vuetify@1.0.10/dist/vuetify.min.js'></script>

<div id="app">
  <v-app>
    <v-container>
      <v-select :items="entidades" item-text="id" item-value="id" single-line auto prepend-icon="group_work" label="Seleccionar Grupo"></v-select>
    </v-container>
  </v-app>
</div>