模板继承

主页面布局

主页面布局定义了所有网页的通用布局。所有 Web 应用程序都有主页面布局来定义所有网页的通用布局。blade 模板引擎定义了可以被所有网页扩展的主布局。主页面布局在 /resources/views/layouts/ 目录下。

让我们通过一个例子来理解。

• 首先，在 resources/views/ 目录下创建名为 'layout' 的文件夹。
• 现在，在 layout 文件夹中创建一个新文件 'master.blade.php'。
• 我们在 master.blade.php 文件中添加以下代码。

master.blade.php

在上面的代码中，我们使用了 @yield 指令。@yield 用于显示内容。@yield('content') 显示 'content' 的内容，而 @yield('footer') 显示页脚的内容。

扩展主布局

• 现在，我们将扩展 contact.blade.php 文件中的上述主布局，如下所示

Contact.blade.php

在上面的代码中，我们使用 @extends 指令。 '@extends' 指令用于继承 contact.blade.php 文件中的 blade 布局。 '@section('content')' 定义了内容的部分。

• 现在，在 web.php 文件中添加以下路由。

输出

我们还可以在 contact.blade.php 文件中添加 javascript 代码。 假设我在 contact.blade.php 文件中添加了以下代码。

在上面的代码中，我创建了警报框，它显示消息“Hello JavaTpoint”。

输出

让我们看看 blade 模板的另一个例子。

• 我们创建一个名为“post.blade.php”的新文件。

post.blade.php

上面的代码定义了内容的部分，我们在其中分别显示 id、密码和名称的值。

• 现在，我们创建一个名为 'PostController.php' 的控制器。

PostController.php

在 PostController.php 文件中，我们定义了一个名为 show_post() 的新函数，该函数将数据传递给 post.blade.php 文件。

• 最后，我们在 web.php 文件中定义一个路由。

web.php

输出

到目前为止，我们已经看到 post.blade.php 和 contact.blade.php 文件都扩展了主布局文件。这是主布局的主要优势，每个文件都可以扩展主文件的布局并添加它们自己的功能。

使用 @parent 指令

@parent 指令的用途是显示在主布局中定义的部分的内容。

让我们通过一个例子来理解。

• 首先，我们创建一个主文件。

master.blade.php

• 现在，我们在其中扩展上述 master.blade.php 文件的 contact.blade.php。

在上面的代码中，@parent 指令将段落内容添加到页脚部分。

输出