Ajax-запрос не дает никаких данных

Question

Я следую руководству и создаю одностраничное приложение, используя laravel и vue.js.Но в определенный момент запрос ajax не дает ожидаемого результата.Я пробовал много способов, но ничего не работает. Шаблон

У меня проблема с

<template>
    <v-container>
        <v-form @submit.prevent="create">
            <v-autocomplete
                    :items="categories"
                    item-text="name"
                    item-value="id"
                    v-model="form.category_id"
                    label="Category"
            ></v-autocomplete>
</template>

<script>
    export default {
        data() {
            return {
                form: {
                    title: null,
                    category_id: null,
                    body: null
                },
                categories: {}, //Expecting to populate the object with axios request.
                errors: {}
            };
        },
        created() {
            axios.get("/api/category").then(res => (this.categories = res.data.data)); //This line is not populating the 'categories' object.
        },
    };
</script>

Контроллер категории, куда я отправляю запрос axios

class CategoryController extends Controller
{
    public function index()
    {
        return Category::latest()->get();
    }

    public function store(Request $request)
    {
        $category = new Category();
        $category->name = $request->name;
        $category->slug = Str::slug($request->name);
        $category->save();
        return response('Created',Response::HTTP_CREATED);
    }

    public function show(Category $category)
    {
        return $category;
    }

    public function update(Request $request, Category $category)
    {
        $category->update(['name'=>$request->name,'slug'=>Str::slug($request->name)]);
    }

    public function destroy(Category $category)
    {
        $category->delete();
        return response(null,Response::HTTP_NO_CONTENT);
    }
}

Я ожидаю, что объект категорий будет заполнен запросом axios, но объект категорий не определен

Answer 1

Предполагая, что /api/category для вашего index() метода, причина, по которой вы не получаете никаких результатов, заключается в том, что вы не возвращаете ничего, что было введено с помощью data (2-й в res.data.data), информация, которую вы нужно будет в res.data.

created() {
    axios.get("/api/category")
        .then(res => this.categories = res.data)
        .catch(err => console.log(err)); 
},