Laravel中具有Vue的循环数组

Question

有人可以在以下问题上帮助我吗？ 我想在laravel中通过vue中的循环运行一个简单的数组，以将所有数组值提供到表中。这是我在网上找到的教程中调整的代码：在此处输入代码

<template>
    <div>
        <h1>Coffeetypes</h1>
        
        <table class="table table-hover">
            <thead>
            <tr>
                <th>ID</th>
                <th>Name</th>
                <th>Description</th>
            </tr>
            </thead>
            <tbody>
                <tr v-for="cctyp in cctypes" v-bind:key="cctyp.id">
                    <td>{{ cctyp.id }}</td>
                    <td>{{ cctyp.name }}</td>
                    <td>{{ cctyp.description }}</td>
                    <td><button class="btn btn-danger">Delete</button></td>
                </tr>
            </tbody>
        </table>

    </div>
</template>

<script>
export default {
    data() {
        return {
            
            cctypes: [],
            cctyp: {
                id: '',
                name: '',
                description: '',
                created_by: '',
                updated_by: ''
            }, 
            id: '',
            pagination: {},
            edit: false
        };
    }, 

    created() {
        this.fetchCCTypes();
    },

    methods: {
        fetchCCTypes(){
            fetch('api/CCTypes')
            .then(res => res.json())
            .then(res => {
                this.cctypes = res.data;
            });
        }
    }
};
</script>

问题是，表中没有填写。

Answer 1

也许是您的fectch方法中的双.then()... ...您应该先console.log记录数据...