laravel - 如何将 axios 结果附加到 vuejs 数据表?
问题描述
我是 vuejs 的新手。我有一个 laravel+vue 项目,其中我使用 vuejs 数据表来显示所有用户。我被困在为什么数据没有附加到 datatable :data 属性上,我还尝试<div v-for="user in users">{{ user.name }}</div>
使用 for 循环在标签中显示数据,然后它正在显示,但是当我在数据表中使用 for 循环时,循环不会停止并且还有控制台中没有错误。请告诉我解决方案并提前感谢。这是我的代码。
用户控制器.php
public function index()
{
return response()->json(['users' => User::all()], 200);
}
用户组件.vue
<template>
<datatable :columns="columns" :data="users"></datatable>
</template>
<script>
export default()
{
data()
{
return {
columns: [
{label: 'id', field: 'id'},
{label: 'Name', field: 'name'},
{label: 'Email', field: 'email'}
],
users: []
};
},
mounted()
{
this.getUsers();
},
methods:
{
getUsers()
{
axios.get('api/user')
.then(res => this.users = res.data.users)
.catch(err => console.log(err))
},
}
}
</script>
解决方案
推荐阅读
- c# - 基础脑电图
- c# - 如何修复Unity中的“'GameObject'类型的对象已被破坏,但您仍在尝试访问它”错误?
- c# - 图像转换器在 Xamarin.Forms 中不起作用
- django - 成功消息不适用于创建视图
- dojo - 如何在dojo工具包的当前JS文件中使用另一个JS文件中创建的对话框变量
- php - 一些 index.php 文件生成或自动出现在我的文档根文件夹中
- sql - SSRS SQL 报表生成器删除列
- android - ArrayMap 比 arraylist 好?
- android - Android 资源链接失败错误:链接引用失败。可绘制对象
- amazon-web-services - 如何在 serverless.yml 中添加方法响应