tasdildiren / primevue-datatables
PrimeVue Datatables的简单、整洁且流畅的服务端实现
v1.0.0
2023-07-10 12:27 UTC
Requires
- php: >=7.4
- illuminate/support: >=8.0
README
这是一个PrimeVue Datatables在Laravel中的简单、整洁和流畅的服务端实现。
特性
- 全局搜索,包括在深度为3的关系中进行搜索,例如
author.user.name
- 默认每列过滤
- 带有方向切换的列排序
- 带有动态
每页或每页记录数
设置的分页 - 与PrimeVue Datatable完全兼容
安装
您可以通过composer安装此包
composer require tasdildiren/primevue-datatables
使用方法
服务端
这就像在您的控制器index()
函数中拥有以下内容一样简单
public function index(Request $request): JsonResponse { $list = PrimevueDatatables::of(Book::query())->make(); return response()->json($list); }
必需查询参数
服务端实现使用laravel请求对象中的两个参数来执行过滤、排序和分页:您必须从客户端传递以下参数作为查询参数
- 可搜索列 (作为
searchable_columns
传递) - 用于指定用于执行全局表格搜索的列 - Dt 参数 (作为
dt_params
传递) - 这是PrimeVue接收到的主表格事件对象。有关详细信息,请参阅Lazy Datatable文档
客户端
有关前端实现的详细信息,请参阅PrimeVue的Lazy Datatable文档。
以下是一个loadLazyData()
实现的示例
const loadLazyData = async () => { loading.value = true; try { const res = await axios.post('/api/books',{ dt_params: lazyParams.value, searchable_columns: ['title','author.name','price'], }); records.value = res.data.data; totalRecords.value = res.data.total; loading.value = false; } catch (e) { records.value = []; totalRecords.value = 0; loading.value = false; } };
更新日志
请参阅CHANGELOG以获取有关最近更改的更多信息。
贡献
请参阅CONTRIBUTING以获取详细信息。
安全
如果您发现任何安全相关的问题,请通过maosa.sam@gmail.com发送电子邮件,而不是使用问题跟踪器。
致谢
许可协议
MIT许可协议(MIT)。有关更多信息,请参阅许可文件。