laravel Blade 模板引擎

介绍

Blade 是 Laravel 的默认模板引擎,Blade 模板文件使用.blade.php 作为文件扩展名,被存放在resources/views目录中,

Blade 模板的常见特性和语法:

1.输出变量

双花括号 {``{ $variable }} 来输出变量的值。eg.{``{ $name }} 将输出名为 $name 的变量的值。

注意:在 Laravel 的 Blade 模板引擎中,{``{ }} 用于输出 PHP 变量并自动进行 HTML 转义,但是一些前端框架如Vue.js、Angular等也使用 {``{ }} 作为模板语法来绑定 JavaScript 变量,Blade 会尝试解析这些 {``{ }},从而导致错误或意外的行为。所以在 Blade 模板中使用 @ 前缀来跳过 {``{ }} 的解析。这样,Blade 会忽略这些带 @ 前缀的 {``{ }},并将其原样输出,以便前端框架(如 Vue.js)能够正确解析。

// Blade 引擎会将其编译为对应的 PHP 代码
{{ $phpData }}
// Blade 引擎编译时会移除 @,保留 {{ $vueData }} 结构
@{{ $vueData }}

2.原始输出

单花括号 {!! $variable !!} 来原样输出变量的值,包括其中的 HTML 代码,因为它不会对内容进行转义

场景举例:在表单通过富文本编辑器编辑后提交的表单数据内容通常包含 HTML 标签,就需要直接渲染,否则浏览器会将这些内容显示为普通文本,而不是渲染为 HTML;

这样{!! $variable !!}编译后的代码就是 <?php echo $variable; ?>

'HTML'转义是一种安全机制,用于将特殊字符转换为 HTML 实体,以防止这些字符被浏览器解析为 HTML 或 JavaScript 代码,来防止XSS攻击,下面是一些常见转义字符

字符 描述 HTML 实体
< 小于号(开始标签) &lt;
> 大于号(结束标签) &gt;
" 双引号 &quot;
' 单引号 '&#39;
& 和号(特殊字符前缀) &amp;
空格 &nbsp;

3.注释

使用 {{--注释--}} 来添加 Blade 注释。这些注释将在渲染时被忽略,不会出现在生成的 HTML 中。

4.Blade 常用指令

(1)If 语句:用 @if ,@elseif ,@else和@endif指令构造 if 语句。这些指令功能与它们所对应的 PHP 语句完全一致

@if (count($records) === 1)
    // 有一条记录
@elseif (count($records) > 1)
    // 有多条记录
@else
    // 没有记录
@endif

为了方便, Blade 还提供了一个 @unless 指令(相当于 @if (! Auth::check()) @endif):

@unless (Auth::check())
    // 还没有登录
@endunless

双冒号 :: 是 PHP 中的范围解析操作符用于访问类的静态成员或常量。使用类名::静态方法名()/ 静态属性名/常量名

(2)循环语句,这些语句的功能和它们所对应的 PHP 语法一致:

@for ($i = 0; $i < 10; $i++)
    The current value is {{ $i }}
@endfor
//$i = 0初始化变量;$i < 10判断变量是否小于10;小于10则$i++变量循环加1;(最后输出10行)

@foreach ($users as $user)
    <p>This is user {{ $user->id }}</p>
@endforeach
//$users:要遍历的数组或集合。$user:当前遍历的元素($users有几个输出几行)

@forelse ($users as $user)
    <li>{{ $user->name }}</li>
@empty
    <p>No users</p>
@endforelse
//foreach的进阶版,就是多了个空输出

@while (true)
    <p>I'm looping forever.</p>
@endwhile
//只要是ture,无限循环

在遍历 foreach 循环时,您可以使用 循环变量 去获取有关循环的有价值的信息,例如,您处于循环的第一个迭代亦或是处于最后一个迭代。

这是比较常用的命令,想了解其他请参考Blade 模板 | Laravel中文文档

5.包含视图

使用 @include('view.name') 来包含其他视图。您可以将常用的部分(如页眉、页脚、导航栏等)定义为独立的视图,并在需要时包含它们。

传递数据给被包含的视图:

@include('partials.header', ['title' => '欢迎来到我的网站'])

包含视图的嵌套:同理啦

<header>
    <h1>{{ $title }}</h1>
    @include('partials.nav')
</header>

视图名称:要包含的视图文件路径,不需要加 .blade.php 后缀。

数据数组(可选):传递给被包含视图的数据。

6.表单处理

使用 @csrf 指令来生成 CSRF 令牌,以防止跨站请求伪造。使用 @method('PUT')@method('DELETE') 等指令来指定表单的 HTTP 方法。

(1)@csrf:在表单中使用 @csrf 指令,Blade 会自动生成一个隐藏的<input> 字段,包含 CSRF 令牌,Laravel 会自动验证该令牌,确保请求是合法的。

eg:

<form action="/submit" method="POST">
    @csrf
    <input type="text" name="name">
    <button type="submit">提交</button>
</form>
//应用

<form action="/submit" method="POST">
    <input type="hidden" name="_token" value="随机生成的 CSRF 令牌">
    <input type="text" name="name">
    <button type="submit">提交</button>
</form>
//生成的html

(2)@method:因为HTML 表单仅支持 GETPOST 方法,所以要使用其他 HTTP 方法(如 PUTPATCHDELETE 等),需要通过 @method 指令伪造方法。在表单中使用 @method 指令,Blade 会生成一个隐藏的 _method 字段,Laravel 会根据该字段的值处理请求。

eg:

<form action="/update/1" method="POST">
    @csrf
    @method('PUT')
    <input type="text" name="name" value="John">
    <button type="submit">更新</button>
</form>
//方法

<form action="/update/1" method="POST">
    <input type="hidden" name="_token" value="随机生成的 CSRF 令牌">
    <input type="hidden" name="_method" value="PUT">
    <input type="text" name="name" value="John">
    <button type="submit">更新</button>
</form>
//生成的html页面

7.布局

使用 <x-app-layout> 标签来定义应用程序的布局。默认情况下,它会渲染 app/View/Components/AppLayout.php 文件,可以根据需要自定义布局组件。举个例子吧:

{``{ $slot }} 是一个特殊的变量,它会被替换为 <x-app-layout> 标签内部的内容。

<x-app-layout>
    <h1>Welcome to my website!</h1>
    <p>This is the main content of the page.</p>
</x-app-layout>

上面的<h1><p> 标签的内容会被插入到 layouts.app 视图的 {``{ $slot }} 位置。

8.模板继承

创建一个基础布局模板(布局模板通常放在 resources/views/layouts 目录下),并使用 @yield 指令来定义可被子视图替换的内容块。使用 @extends@section@yield 来实现模板继承。

从ai上找了简单的代码示例,可以非常清晰地了解他们的用法

  1. 创建布局模板

创建一个名为 app.blade.php 的布局模板:

<!DOCTYPE html>
<html>
<head>
    <title>@yield('title', '默认标题')</title>
</head>
<body>
    <header>
        <h1>网站标题</h1>
    </header>

    <main>
        @yield('content')
    </main>

    <footer>
        <p>版权所有 &copy; 2023</p>
    </footer>
</body>
</html>
  • @yield('title', '默认标题'):定义一个可替换的区域,名称为 title,并提供一个默认值(如果子模板没有填充 title,则显示 默认标题)。

  • @yield('content'):定义另一个可替换的区域,名称为 content

  1. 创建子模板

子模板继承布局模板,并填充或覆盖布局模板中的可替换区域。例如,创建一个名为 home.blade.php 的子模板:

@extends('layouts.app')

@section('title', '首页')

@section('content')
    <p>这是首页的内容。</p>
@endsection
  • @extends('layouts.app'):指定子模板继承 layouts/app.blade.php 布局模板。

  • @section('title', '首页'):填充布局模板中的 title 区域,内容为 首页

  • @section('content'):填充布局模板中的 content 区域,内容为 <p>这是首页的内容。</p>

  1. 渲染子模板

在控制器中渲染子模板时,Blade 会自动将子模板的内容插入到布局模板的相应位置:

// 在控制器中
public function index()
{
    return view('home');
}
  1. 最终渲染结果

Blade 会将子模板的内容插入到布局模板中,生成最终的 HTML:

<!DOCTYPE html>
<html>
<head>
    <title>首页</title>
</head>
<body>
    <header>
        <h1>网站标题</h1>
    </header>

    <main>
        <p>这是首页的内容。</p>
    </main>

    <footer>
        <p>版权所有 &copy; 2023</p>
    </footer>
</body>
</html>

emmmm这可能考的不多,我也没找到啥题型。。。。。





相关推荐
程序员buddha1 小时前
ThinkPHP8.0+MySQL8.0搭建简单实用电子证书查询系统
javascript·css·mysql·php·layui·jquery·html5
网络安全(king)2 小时前
基于java社交网络安全的知识图谱的构建与实现
开发语言·网络·深度学习·安全·web安全·php
Wiktok8 小时前
ThinkPHP6用户登录系统的全过程
php·mvc
Hacker_LaoYi8 小时前
网络安全工具nc(NetCat)
安全·web安全·php
zzyh12345618 小时前
tcp/ip协议配置参数有哪些?tcp/ip协议需要设置的参数有哪些
网络协议·tcp/ip·php
苏琢玉1 天前
用装饰器模式实现多层缓存:让PHP应用更快更稳
php
晴天Y281 天前
为php添加额外的功能模块
开发语言·php
网硕互联的小客服1 天前
Linux 系统负载过高的排查思路
linux·服务器·php
硬件进化论1 天前
从基础到实践(十三):无源晶振和有源晶振的应用指南
开发语言·人工智能·php·硬件工程·模块测试