主页/PHP笔记/PHP问答/框架Laravel/Laravel:在 Blade 模板中使用 PHP 数组数据渲染表格

Laravel:在 Blade 模板中使用 PHP 数组数据渲染表格

Bug编译狮

Bug编译狮

在 Laravel 中,你可以使用 Blade 模板引擎来处理和渲染复杂的 HTML 内容,包括数组数据。下面是一个简单的示例,展示了如何在 Blade 模板中使用 PHP 数组数据渲染一个表格。

1. 创建一个新的控制器

首先,创建一个新的控制器来处理请求并返回视图:

php artisan make:controller TableController

2. 编辑控制器文件

打开 app/Http/Controllers/TableController.php 文件,并添加以下代码:

<?php

namespace AppHttpControllers;

use IlluminateHttpRequest;

class TableController extends Controller
{
    public function index()
    {
        // 示例数组数据
        $data = [
            ['name' => 'Alice', 'age' => 30],
            ['name' => 'Bob', 'age' => 25],
            ['name' => 'Charlie', 'age' => 35]
        ];

        return view('table', compact('data'));
    }
}

3. 创建 Blade 视图

接下来,创建一个 Blade 视图文件来显示表格。在 resources/views 目录下创建一个名为 table.blade.php 的文件,并添加以下代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Laravel Table Example</title>
</head>
<body>
    <h1>User List</h1>
    <table border="1">
        <tr>
            <th>Name</th>
            <th>Age</th>
        </tr>
        @foreach ($data as $item)
        <tr>
            <td>{{ $item['name'] }}</td>
            <td>{{ $item['age'] }}</td>
        </tr>
        @endforeach
    </table>
</body>
</html>

4. 配置路由

最后,配置路由以指向新的控制器方法:

php artisan route:list

你应该能看到类似以下的路由定义:

| Name           | URL                          | Method     | Action                  |
+-----------------+------------------------------+------------+--------------------------+
| table          | /table                        | GET        | AppHttpControllersTableController@index |

5. 访问路由

现在,你可以通过访问 /table 路由来查看生成的表格:

http://your-laravel-app.com/table

示例代码解释

  • 控制器

    • 使用 compact 函数将数组数据传递给视图。
    • 返回视图 table
  • 视图

    • 使用 @foreach 循环遍历数组数据。
    • 使用 {{ }} 指令输出每个元素的值。

通过这种方式,你可以在 Laravel 中轻松地使用 Blade 模板引擎来处理和渲染复杂的数据结构,如数组数据。

黑板Bug讲师

黑板Bug讲师

介绍

Laravel Blade 是与 Laravel 一起提供的强大模板引擎,使从 PHP 数组渲染 HTML 表格变得直观和容易。在这篇教程中,我们将指导您通过基本到高级步骤,展示如何在 Blade 视图中以表格形式显示 PHP 数组数据。理解这个概念对于希望在 Laravel 应用程序中显示结构化数据的开发人员至关重要。

设置控制器

在前往Blade之前,让我们先设置我们的控制器以使用假数据。

<?php

namespace AppHttpControllers;

class TableController extends Controller
{
    public function index()
    {
        $data = [
            ['id' => 1, 'name' => 'John', 'email' => '[email protected]'],
            ['id' => 2, 'name' => 'Jane', 'email' => '[email protected]'],
            //... other records
        ];

        return view('table', compact('data'));
    }
}

基础表格渲染

现在,让我们聚焦于名为“刀刃”视图的。table.blade.php好的,请提供需要翻译的内容。

<!-- resources/views/table.blade.php -->
<table>
    <thead>
        <tr>
            <th>ID</th>
            <th>Name</th>
            <th>Email</th>
        </tr>
    </thead>
    <tbody>
        @foreach($data as $row)
            <tr>
                <td>{{ $row['id'] }}</td>
                <td>{{ $row['name'] }}</td>
                <td>{{ $row['email'] }}</td>
            </tr>
        @endforeach
    </tbody>
</table>

这个基本的例子只是遍历列表中的每个元素。$data数组从控制器传递并显示在表格行和数据单元格中。

增强功能使用Bootstrap

我们现在可以通过引入Bootstrap框架来增强我们的表格外观。

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" rel="stylesheet">

<table class="table">
    <!-- Table Content -->
</table>

添加排序功能

按照渐进增强的原则,我们将在现有的带有Bootstrap的表格头部添加排序功能。我们将继续从Bootstrap增强过的表格开始。

<!-- Additional sorting feature, not implemented in actual code here -->
<th>
    <a href="?sortby=id&order=asc">ID</a>
</th>
<!-- Other table headers -->

这段代码片段建议了前端更改,展示了如何结构链接以进行排序;在控制器中实现排序逻辑超出了这个可视化的范围。

分页显示表格数据

Laravel的分页器在Blade模板中使用起来非常方便。以下是应用分页的方法:

public function index()
{
    $data = User::paginate(10); // Eloquent model example
    return view('table', compact('data'));
}

在Blade视图中,你可以这样渲染分页器:

<!-- Table as above -->

<div class="text-center">
    {{ $data->links() }}
</div>

处理空数据集

当可能没有返回数据时,优雅地处理空状态至关重要。

<tbody>
    @forelse ($data as $row)
        <!-- Table rows -->
    @empty
        <tr>
            <td colspan="3">No records found.</td>
        </tr>
    @endforelse
</tbody>

高级列自定义

使用更复杂的数据结构时,您可能需要选择性地显示信息。Blade的模板功能使得这一点非常容易。

<tr>
    <td>{{ $row['id'] }}</td>
    <!-- More columns -->
    <td>
        <button class="btn btn-primary">View</button>
    </td>
</tr>

你可以插入任何HTML或Blade指令来个性化每个列的渲染。

结论。

通过本教程,我们已经看到如何使用Laravel的Blade使其简单地从PHP数组渲染表格,并逐步增强它们的功能,如分页、排序和Bootstrap样式化。有效的数据呈现和展示为在Laravel构建用户友好的Web应用程序奠定了基础。

长工码奴1523

长工码奴1523

要在 Laravel 的 Blade 模板中使用 PHP 数组数据来渲染表格,你可以遵循以下步骤:

  1. 首先确保你的项目已经安装了 Laravel 和 Blade 模板引擎。
  2. 创建一个新的控制器和相应的视图文件(例如 index.blade.php)。
  3. 在控制器中定义一个方法,用于处理请求并返回视图。
<?php

namespace AppHttpControllers;

use IlluminateHttpRequest;
use AppModelsEmployee;

class EmployeeController extends Controller
{
    public function index()
    {
        // 获取所有员工的列表
        $employees = Employee::all();

        return view('employee.index', ['employees' => $employees]);
    }
}
  1. 在对应的视图文件中,你可以使用 blade 模板语法来遍历数组并将数据插入到模板中。
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Employees</title>
</head>
<body>
    <table>
        <thead>
            <tr>
                <th>Name</th>
                <th>Email</th>
                <th>Department</th>
            </tr>
        </thead>
        <tbody>
            @foreach ($employees as $employee)
                <tr>
                    <td>{{ $employee->name }}</td>
                    <td>{{ $employee->email }}</td>
                    <td>{{ $employee->department }}</td>
                </tr>
            @endforeach
        </tbody>
    </table>
</body>
</html>

在这个例子中,我们首先从数据库获取所有的员工数据,并将这些数据存储在一个名为 $employees 的变量中。然后,我们在模板中使用 Blade 模板语法来遍历这个数组,并将其数据插入到表格中。这样,每次用户访问该页面时,都会看到更新后的表格。

注意:上述代码仅作为一个基本示例,实际应用中可能会根据需要进行调整。例如,你可能需要添加额外的验证规则,或者处理错误情况等。