尽管 json 数组在 vue 页面中，但数据未传入 vue 模板

Question

我正在使用 axios 从 laravel API 获取数据。我在相应的 vue 页面中获取 API 数据（在 created() 挂钩中），但它没有传递到模板中。我在这里分享控制台图片：

我的 vue 代码是：

export default {
    name : "employee-list",

    data() {
        return{
            employee_list : []
        }
    },

    async created() {
        const res = await axios.get('/employees-list')
        if(res.status == 200){
            console.log(res.data)
           this.employee_list = res.data
        }else{
           console.log('something went wrong')
        }
    }
}

我的模板 table :

<table class="employee-list">
    <tr>
        <td>Full Name</td>
        <td>Email</td>
        <td>Phone</td>
        <td>Designation</td>
        <td>Loans</td>
        <td>Salary</td>
        <td>Joining Date</td>
        <td>Address</td>
        <td>Photo</td>
        <td>Status</td>
        <td>Action</td>
    </tr>
    <tr v-for="(employee, i) in employee_list" :key="i">
        <td>{{employee.full_name}}</td>
        <td>{{employee.email}}</td>
        <td>{{employee.phone}}</td>
        <td>{{employee.designation}}</td>
        <td>{{employee.loans}}</td>
        <td>{{employee.salary}}</td>
        <td>{{employee.joining_date}}</td>
        <td>{{employee.address}}</td>
        <td>{{employee.photo}}</td>
        <td>{{employee.status}}</td>
        <td><button :id="employee.id">Edit</button></td>
    </tr>
</table>

我也试过 callApi() 方法，但它说“this.callApi 不是一个函数”

Answer 1

res.data 中似乎有一个双数组，而不是一个，这就是为什么你看到一行没有数据的原因

尽管 json 数组在 vue 页面中，但数据未传入 vue 模板

data is not passing in vue template although the json array is in vue page

laravel

vue.js