Question

我很难用后端的数据填充v-select组件。后端数据为json格式。

数组“ items_category”未存储数据。因此我在v-select中看到“无可用数据”。谁能帮我。谢谢。这是我的代码：

<v-select v-model="category" :items="items_category" chips dense></v-select>

data () {
  return {
    category: '',
    items_category: [],
    categories: [],
    i: 0
  }
},

created () {
  this.initialize()
},

methods: {
    initialize () {
        axios.get('http://localhost:4000/categories', {
            })
                .then(response => { 
                    this.categories = response.data

                    for (this.i=0; this.i<this.categories.length; this.i++) {
                        this.items_category[this.i] = this.categories[this.i].category_name
                    }
                })
                .catch(function (error) {
                    console.log(error);
            }) 
    }
}

这是我的json（http://localhost:4000/categories）：

[
  {
    "id": 1,
    "category_name": "Name 1",
    "category_description": "Description 1"
  },   
  {
    "id": 2,
    "category_name": "Premium",
    "category_description": "Description 2"
  },
  {
    "id": 3,
    "category_name": "Free",
    "category_description": "Description 3"
  }
]

Answer 1

好，我使用push方法将其正确

this.items_category.push(this.categories[this.i].category_name)

如何使用来自axios.get的json数据填充v-select组件

1 个答案: