后盾人

Appearance

视图 ​

简介 ​

当然,直接从路由和控制器返回整个 HTML 文档字符串是不切实际的。幸运的是,视图提供了一种方便的方式来将所有 HTML 放在单独的文件中。

视图将控制器/应用程序逻辑与表现逻辑分开,并存储在 resources/views 目录中。在使用 Laravel 时,视图模板通常使用 Blade 模板语言 编写。一个简单的视图可能如下所示:

blade
<!-- 视图存储在 resources/views/greeting.blade.php -->

<html>
    <body>
        <h1>你好, {{ $name }}</h1>
    </body>
</html>

由于这个视图存储在 resources/views/greeting.blade.php,我们可以使用全局 view 辅助函数返回它,如下所示:

php
    Route::get('/', function () {
        return view('greeting', ['name' => '小明']);
    });

[!注意]
想了解更多关于如何编写 Blade 模板的信息吗?查看完整的 Blade 文档 以开始使用。

使用 React / Vue 编写视图 ​

许多开发者开始更喜欢使用 React 或 Vue 而不是通过 Blade 用 PHP 编写前端模板。Laravel 借助 Inertia 使这变得很容易,Inertia 是一个库,可以轻松地将 React / Vue 前端与 Laravel 后端连接起来,而无需构建 SPA 的典型复杂性。

我们的 Breeze 和 Jetstream 启动套件 为您的下一个由 Inertia 驱动的 Laravel 应用程序提供了一个很好的起点。此外,Laravel Bootcamp 提供了一个完整的演示,展示了如何构建一个由 Inertia 驱动的 Laravel 应用程序,包括 Vue 和 React 的示例。

创建和渲染视图 ​

您可以通过在应用程序的 resources/views 目录中放置一个扩展名为 .blade.php 的文件来创建视图,或者使用 make:view Artisan 命令:

shell
php artisan make:view greeting

.blade.php 扩展名告诉框架该文件包含一个 Blade 模板。Blade 模板包含 HTML 以及 Blade 指令,这些指令允许您轻松地输出值、创建"if"语句、迭代数据等。

创建视图后,您可以使用全局 view 辅助函数从应用程序的路由或控制器中返回它:

php
    Route::get('/', function () {
        return view('greeting', ['name' => '小明']);
    });

视图也可以使用 View 门面返回:

php
    use Illuminate\Support\Facades\View;

    return View::make('greeting', ['name' => '小明']);

如您所见,传递给 view 辅助函数的第一个参数对应于 resources/views 目录中的视图文件名。第二个参数是应该提供给视图的数据数组。在这种情况下,我们正在传递 name 变量,它使用 Blade 语法 在视图中显示。

嵌套视图目录 ​

视图也可以嵌套在 resources/views 目录的子目录中。可以使用"点"表示法来引用嵌套视图。例如,如果您的视图存储在 resources/views/admin/profile.blade.php,您可以从应用程序的路由/控制器中这样返回它:

php
    return view('admin.profile', $data);

[!警告]
视图目录名不应包含 . 字符。

创建第一个可用的视图 ​

使用 View 门面的 first 方法,您可以创建给定视图数组中第一个存在的视图。如果您的应用程序或包允许自定义或覆盖视图,这可能很有用:

php
    use Illuminate\Support\Facades\View;

    return View::first(['custom.admin', 'admin'], $data);

判断视图是否存在 ​

如果您需要确定视图是否存在,可以使用 View 门面。如果视图存在,exists 方法将返回 true:

php
    use Illuminate\Support\Facades\View;

    if (View::exists('admin.profile')) {
        // ...
    }

向视图传递数据 ​

如您在前面的示例中所看到的,您可以将数据数组传递给视图,以使该数据可用于视图:

php
    return view('greetings', ['name' => '小红']);

以这种方式传递信息时,数据应该是一个键/值对数组。向视图提供数据后,您可以在视图中使用数据的键访问每个值,例如 <?php echo $name; ?>。

作为向 view 辅助函数传递完整数据数组的替代方法,您可以使用 with 方法向视图添加单个数据片段。with 方法返回视图对象的实例,因此您可以在返回视图之前继续链接方法:

php
    return view('greeting')
                ->with('name', '小红')
                ->with('occupation', '宇航员');

与所有视图共享数据 ​

有时,您可能需要与应用程序渲染的所有视图共享数据。您可以使用 View 门面的 share 方法来实现这一点。通常,您应该在服务提供者的 boot 方法中放置对 share 方法的调用。您可以将它们添加到 App\Providers\AppServiceProvider 类中,或者生成一个单独的服务提供者来存放它们:

php
    <?php

    namespace App\Providers;

    use Illuminate\Support\Facades\View;

    class AppServiceProvider extends ServiceProvider
    {
        /**
         * 注册任何应用程序服务。
         */
        public function register(): void
        {
            // ...
        }

        /**
         * 引导任何应用程序服务。
         */
        public function boot(): void
        {
            View::share('key', 'value');
        }
    }

视图组件 ​

视图组件是在渲染视图时调用的回调或类方法。如果您有想要在每次渲染视图时绑定到视图的数据,视图组件可以帮助您将该逻辑组织到一个单独的位置。如果同一个视图被应用程序中的多个路由或控制器返回,并且总是需要特定的数据,视图组件可能特别有用。

通常,视图组件将在应用程序的 服务提供者 之一中注册。在这个例子中,我们假设 App\Providers\AppServiceProvider 将包含这个逻辑。

我们将使用 View 门面的 composer 方法来注册视图组件。Laravel 没有为基于类的视图组件提供默认目录,因此您可以自由地组织它们。例如,您可以创建一个 app/View/Composers 目录来存放应用程序的所有视图组件:

php
    <?php

    namespace App\Providers;

    use App\View\Composers\ProfileComposer;
    use Illuminate\Support\Facades;
    use Illuminate\Support\ServiceProvider;
    use Illuminate\View\View;

    class AppServiceProvider extends ServiceProvider
    {
        /**
         * 注册任何应用程序服务。
         */
        public function register(): void
        {
            // ...
        }

        /**
         * 引导任何应用程序服务。
         */
        public function boot(): void
        {
            // 使用基于类的组件...
            Facades\View::composer('profile', ProfileComposer::class);

            // 使用基于闭包的组件...
            Facades\View::composer('welcome', function (View $view) {
                // ...
            });

            Facades\View::composer('dashboard', function (View $view) {
                // ...
            });
        }
    }

现在我们已经注册了组件,每次渲染 profile 视图时,都会执行 App\View\Composers\ProfileComposer 类的 compose 方法。让我们看一下组件类的示例:

php
    <?php

    namespace App\View\Composers;

    use App\Repositories\UserRepository;
    use Illuminate\View\View;

    class ProfileComposer
    {
        /**
         * 创建一个新的 profile 组件。
         */
        public function __construct(
            protected UserRepository $users,
        ) {}

        /**
         * 将数据绑定到视图。
         */
        public function compose(View $view): void
        {
            $view->with('count', $this->users->count());
        }
    }

如您所见,所有视图组件都通过 服务容器 解析,因此您可以在组件的构造函数中类型提示任何需要的依赖项。

将组件附加到多个视图 ​

您可以通过将视图数组作为第一个参数传递给 composer 方法,将视图组件一次附加到多个视图:

php
    use App\Views\Composers\MultiComposer;
    use Illuminate\Support\Facades\View;

    View::composer(
        ['profile', 'dashboard'],
        MultiComposer::class
    );

composer 方法也接受 * 字符作为通配符,允许您将组件附加到所有视图:

php
    use Illuminate\Support\Facades;
    use Illuminate\View\View;

    Facades\View::composer('*', function (View $view) {
        // ...
    });

视图创建器 ​

视图"创建器"与视图组件非常相似;然而,它们在视图实例化后立即执行,而不是等到视图即将渲染时。要注册视图创建器,请使用 creator 方法:

php
    use App\View\Creators\ProfileCreator;
    use Illuminate\Support\Facades\View;

    View::creator('profile', ProfileCreator::class);

优化视图 ​

默认情况下,Blade 模板视图是按需编译的。当执行渲染视图的请求时,Laravel 将确定编译版本的视图是否存在。如果文件存在,Laravel 将确定未编译的视图是否比编译的视图更新。如果编译的视图不存在,或者未编译的视图已被修改,Laravel 将重新编译该视图。

在请求期间编译视图可能会对性能产生轻微的负面影响,因此 Laravel 提供了 view:cache Artisan 命令来预编译应用程序使用的所有视图。为了提高性能,您可能希望在部署过程中运行此命令:

shell
php artisan view:cache

您可以使用 view:clear 命令清除视图缓存:

shell
php artisan view:clear

后盾人版权所有 © 2018-2024 创作不易请尊重他人劳动成果，未经授权禁止转载！