如何使用Composer解决Laravel项目中的数据表格展示问题？yajra/laravel-datatables助你轻松实现！-composer-PHP中文网

如何使用Composer解决Laravel项目中的数据表格展示问题？yajra/laravel-datatables助你轻松实现！

王林

发布： 2025-04-21 09:26:21

原创

1006人浏览过

可以通过一下地址学习composer：学习地址

在开发 laravel 项目时，数据表格的展示和处理是一个常见且重要的需求。我最近在项目中遇到了一个棘手的问题：如何高效地展示大量数据，并提供排序、搜索、分页等功能。开始时，我尝试了手动编写代码来实现这些功能，但发现这不仅耗时，而且容易出错。经过一番探索，我找到了 yajra/laravel-datatables 这个库，它不仅解决了我的问题，还让我在数据处理上获得了极大的便利。

安装 yajra/laravel-datatables

使用 Composer 安装这个库非常简单，只需运行以下命令：

<code>composer require yajra/laravel-datatables:^12</code>

登录后复制

安装完成后，如果你使用的是 Laravel 5.5 以下的版本，还需要在 config/app.php 文件中注册服务提供者：

<code>Yajra\DataTables\DataTablesServiceProvider::class,
Yajra\DataTables\ButtonsServiceProvider::class,
Yajra\DataTables\FractalServiceProvider::class</code>

登录后复制

配置和发布资源

为了进一步配置和发布资源，可以运行以下命令：

<code>php artisan vendor:publish</code>

登录后复制

这会将 yajra/laravel-datatables 的配置文件和资源文件发布到你的项目中，方便你进行自定义设置。

使用示例

安装和配置完成后，你可以轻松地在你的 Laravel 项目中使用 DataTables。例如，以下是一个简单的控制器方法，用于展示用户数据：

GPT-MINUS1

通过在文本中随机地用同义词替换单词来愚弄GPT

查看详情

<code class="php">use Yajra\DataTables\DataTables;

public function getUsers(Request $request)
{
    if ($request->ajax()) {
        $data = User::select(['id', 'name', 'email', 'created_at', 'updated_at']);
        return Datatables::of($data)->make(true);
    }

    return view('users.index');
}</code>

登录后复制

在视图文件中，你可以这样调用 DataTables：

<code class="html"><table id="users-table" class="table table-bordered">
    <thead>
        <tr>
            <th>Id</th>
            <th>Name</th>
            <th>Email</th>
            <th>Created At</th>
            <th>Updated At</th>
        </tr>
    </thead>
</table>

<script>
    $(function() {
        $('#users-table').DataTable({
            processing: true,
            serverSide: true,
            ajax: '{!! route('users.getUsers') !!}',
            columns: [
                { data: 'id', name: 'id' },
                { data: 'name', name: 'name' },
                { data: 'email', name: 'email' },
                { data: 'created_at', name: 'created_at' },
                { data: 'updated_at', name: 'updated_at' }
            ]
        });
    });
</script></code>

登录后复制