Views

Introduction

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

视图将您的控制器/应用程序逻辑与您的表示逻辑分开,并存储在resources/views 目录。使用 Laravel 时,视图模板通常使用刀片模板语言.一个简单的视图可能看起来像这样:

<!-- View stored in resources/views/greeting.blade.php -->

<html>
    <body>
        <h1>Hello, {{ $name }}</h1>
    </body>
</html>

由于此视图存储在resources/views/greeting.blade.php,我们可以使用全局返回它view 像这样的帮手:

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

Note
寻找有关如何编写 Blade 模板的更多信息?查看完整的刀片文档 开始。

在 React / Vue 中编写视图

许多开发人员开始更喜欢使用 React 或 Vue 编写他们的模板,而不是通过 Blade 在 PHP 中编写他们的前端模板。 Laravel 使这一切变得轻松,这要归功于Inertia,一个库,可以轻松地将 React / Vue 前端绑定到 Laravel 后端,而无需构建 SPA 的典型复杂性。

我们的 Breeze 和 Jetstream入门套件 为你的下一个由 Inertia 提供支持的 Laravel 应用程序提供一个很好的起点。除此之外Laravel 训练营 提供了构建由 Inertia 提供支持的 Laravel 应用程序的完整演示,包括 Vue 和 React 中的示例。

创建和渲染视图

您可以通过放置一个文件来创建一个视图.blade.php 在你的应用程序中扩展resources/views 目录。这.blade.php 扩展名通知框架该文件包含一个刀片模板. Blade 模板包含 HTML 和 Blade 指令,允许您轻松地回显值、创建“if”语句、迭代数据等。

创建视图后,您可以使用全局方法从应用程序的路由或控制器之一返回它view 帮手:

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

也可以使用View 正面:

use Illuminate\Support\Facades\View;

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

如您所见,第一个参数传递给view helper 对应于视图文件中的名称resources/views 目录。第二个参数是应该对视图可用的数据数组。在这种情况下,我们通过name 变量,它显示在视图中使用刀片语法.

嵌套视图目录

视图也可以嵌套在resources/views 目录。 “点”符号可用于引用嵌套视图。例如,如果您的视图存储在resources/views/admin/profile.blade.php,您可以像这样从应用程序的路由/控制器之一返回它:

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

Warning
查看目录名称不应包含. 特点。

创建第一个可用视图

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

use Illuminate\Support\Facades\View;

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

确定视图是否存在

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

use Illuminate\Support\Facades\View;

if (View::exists('emails.customer')) {
    // ...
}

将数据传递给视图

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

return view('greetings', ['name' => 'Victoria']);

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

作为将完整数据数组传递给view 辅助函数,你可以使用with 方法将单个数据添加到视图中。这with 方法返回视图对象的实例,以便您可以在返回视图之前继续链接方法:

return view('greeting')
            ->with('name', 'Victoria')
            ->with('occupation', 'Astronaut');

与所有视图共享数据

有时,您可能需要与应用程序呈现的所有视图共享数据。您可以使用View 门面的share 方法。通常,您应该调用share 服务提供商的方法boot 方法。您可以随意将它们添加到App\Providers\AppServiceProvider 分类或生成一个单独的服务提供者来容纳它们:

<?php

namespace App\Providers;

use Illuminate\Support\Facades\View;

class AppServiceProvider extends ServiceProvider
{
    /**
     * Register any application services.
     */
    public function register(): void
    {
        // ...
    }

    /**
     * Bootstrap any application services.
     */
    public function boot(): void
    {
        View::share('key', 'value');
    }
}

查看作曲家

视图组合器是在呈现视图时调用的回调或类方法。如果您希望在每次呈现视图时将数据绑定到该视图,视图组合器可以帮助您将该逻辑组织到一个位置。如果您的应用程序中的多个路由或控制器返回相同的视图并且始终需要特定的数据,那么视图组合器可能会特别有用。

通常,视图作曲家将在您的应用程序之一中注册服务供应商.在这个例子中,我们假设我们已经创建了一个新的App\Providers\ViewServiceProvider 容纳这个逻辑。

我们将使用View 门面的composer 注册视图编辑器的方法。 Laravel 不包含基于类的视图组合器的默认目录,因此您可以随意组织它们。例如,您可以创建一个app/View/Composers 存放应用程序所有视图编辑器的目录:

<?php

namespace App\Providers;

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

class ViewServiceProvider extends ServiceProvider
{
    /**
     * Register any application services.
     */
    public function register(): void
    {
        // ...
    }

    /**
     * Bootstrap any application services.
     */
    public function boot(): void
    {
        // Using class based composers...
        Facades\View::composer('profile', ProfileComposer::class);

        // Using closure based composers...
        Facades\View::composer('welcome', function (View $view) {
            // ...
        });

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

Warning
请记住,如果您创建一个新的服务提供者来包含您的视图作曲家注册,您将需要将该服务提供者添加到providers 中的数组config/app.php 配置文件。

现在我们已经注册了作曲家,compose 的方法App\View\Composers\ProfileComposer 类将在每次执行profile 正在渲染视图。我们来看一个 composer 类的例子:

<?php

namespace App\View\Composers;

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

class ProfileComposer
{
    /**
     * Create a new profile composer.
     */
    public function __construct(
        protected UserRepository $users,
    ) {}

    /**
     * Bind data to the view.
     */
    public function compose(View $view): void
    {
        $view->with('count', $this->users->count());
    }
}

如您所见,所有视图作曲家都通过服务容器,因此您可以在作曲家的构造函数中对您需要的任何依赖项进行类型提示。

将 Composer 附加到多个视图

您可以通过将视图数组作为第一个参数传递给composer 方法:

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

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

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

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

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

查看创作者

视图“创建者”与视图作曲家非常相似;但是,它们会在视图实例化后立即执行,而不是等到视图即将呈现时执行。要注册视图创建者,请使用creator 方法:

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

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

优化视图

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

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

php artisan view:cache

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

php artisan view:clear
豫ICP备18041297号-2