如何解决用 vueJS 填充数据表
我正在用 vueJS 和我来自 DB 的所有数据填充我的数据表。我正在使用这个库:
https://jamesdordoy.github.io/laravel-vue-datatable
如果我在我的控制器中使用它就可以了:
User::all()
return response()->json($query);
在我的组件中:
<div class="">
<data-table :data="data" :columns="columns" @on-table-props-changed="reloadTable"></data-table>
</div>
这个库包含 sortBy、orderBy、按名称搜索等的方法......使用这个:
use JamesDordoy\LaravelVueDatatable\Http\Resources\DataTableCollectionResource;
public function index(Request $request)
{
$length = $request->input('length');
$sortBy = $request->input('column');
$orderBy = $request->input('dir');
$searchValue = $request->input('search');
$query = User::eloquentQuery($sortBy,$orderBy,$searchValue);
$data = $query->paginate($length);
return new DataTableCollectionResource($data);
}
但是如果我在 Laravel 8 的控制器中使用它返回给我:
Call to undefined method App\Models\User::eloquentQuery()
我不知道这是否意味着使用 get()、all()。
此外,如果我不使用它而我手动进行所有搜索,例如:
if(isset($sortBy)){
$query = User::all()->sortBy($sortBy);
$data = $query->paginate($length);
}
return response()->json($query);
回复我:
Method Illuminate\Database\Eloquent\Collection::paginate does not exist
如果我删除分页并返回 $query,在网络选项卡中返回我的网络浏览器控制台中的所有数据,但我的表是空的...
后端我使用的是 laravel-8
在我的网络浏览器控制台中返回此消息:
Invalid prop: type check Failed for prop "data". Expected Object,got Array
如果我更改组件中的 :data
以导致网络浏览器控制台中的 :items
错误消失
我不明白我做错了,因为在一种情况下我可以填满我的桌子,而在另一种情况下不能......
感谢阅读并帮助我
解决方法
我用这个解决了我的问题:
$query = \DB::table('users')->orderBy($sortBy,$order)->paginate(10);
模型我不能
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。