介绍
当然,从您的路由和控制器中直接返回整个 HTML 文档字符串是不实际的。值得庆幸的是,视图为我们将所有 HTML 放置在单独的文件中提供了一种便捷的方式。
视图将您的控制器/应用程序逻辑与表示逻辑分开,并存储在 resources/views
目录中。在使用 Laravel 时,视图模板通常使用 Blade 模板语言 编写。一个简单的视图可能如下所示:
<!-- 存储在 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 模板的信息?查看完整的 Blade 文档 以开始学习。
在 React / Vue 中编写视图
许多开发人员开始倾向于使用 React 或 Vue 编写他们的前端模板,而不是通过 Blade 在 PHP 中编写。由于 Inertia (opens in a new tab),Laravel 使这一过程变得轻松,该库使您可以轻松地将 React / Vue 前端与 Laravel 后端连接起来,而无需构建单页应用程序的典型复杂性。
我们的 Breeze 和 Jetstream 入门套件 为您的下一个由 Inertia 驱动的 Laravel 应用程序提供了一个很好的起点。此外,Laravel 训练营 (opens in a new tab) 提供了一个由 Inertia 驱动的 Laravel 应用程序构建的完整演示,包括 Vue 和 React 中的示例。
创建和渲染视图
您可以通过在应用程序的 resources/views
目录中放置一个具有 .blade.php
扩展名的文件或使用 make:view
Artisan 命令来创建视图:
php artisan make:view greeting
.blade.php
扩展名告知框架该文件包含一个 Blade 模板。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
辅助函数的第一个参数对应于 resources/views
目录中视图文件的名称。第二个参数是一个数据数组,应该提供给视图。在这种情况下,我们正在传递 name
变量,该变量使用 Blade 语法 在视图中显示。
嵌套视图目录
视图也可以嵌套在 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('admin.profile')) {
//...
}
向视图传递数据
正如您在前面的示例中所看到的,您可以向视图传递一个数据数组,以使该数据可用于视图:
return view('greetings', ['name' => 'Victoria']);
以这种方式传递信息时,数据应该是一个带有键/值对的数组。在向视图提供数据后,您可以使用数据的键在视图中访问每个值,例如 <?php echo $name;?>
。
作为将完整数据数组传递给 view
辅助函数的替代方法,您可以使用 with
方法向视图添加单个数据片段。with
方法返回视图对象的实例,以便您可以在返回视图之前继续链接方法:
return view('greeting')
->with('name', 'Victoria')
->with('occupation', 'Astronaut');
与所有视图共享数据
有时,您可能需要与应用程序呈现的所有视图共享数据。您可以使用 View
外观的 share
方法来实现。通常,您应该在服务提供者的 boot
方法中调用 share
方法。您可以将它们添加到 App\Providers\AppServiceProvider
类中,或者生成一个单独的服务提供者来容纳它们:
<?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
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
namespace App\View\Composers;
use App\Repositories\UserRepository;
use Illuminate\View\View;
class ProfileComposer
{
/**
* 创建一个新的配置文件组合器。
*/
public function __construct(
protected UserRepository $users,
) {}
/**
* 将数据绑定到视图。
*/
public function compose(View $view): void
{
$view->with('count', $this->users->count());
}
}
如您所见,所有视图组合器都是通过服务容器解析的,因此您可以在组合器的构造函数中键入提示您需要的任何依赖项。
将组合器附加到多个视图
您可以通过将视图数组作为 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