豪翔天下

Change My World by Program

0%

Laravel Blade模板引擎

常用语法

基本标签

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
# 转义,显示原始html内容
{!! $name !!}

# 转义花括号,因为花括号是特殊字符,如果要直接显示{{}}等内容需要在前面加入@符号
@{{ $name }} // 会直接显示{{ $name }}

# 使用or简化三目运算符
{{ $name or 'Default'}} // {{ isset($name) ? $name : 'Default' }}

# 时间格式转换
{{ $user->created_at->format('d/m/Y') }}

# 获取当前路由
{{ url()->current() == route('/user') }}

# 获取路由参数
{{ request()->get('abc') }}

# 带路由参数的路由生成
{{ route('/users', $id)}}
{{ route('/users', [$id])}}
{{ route('/users', ['id' => $id])}}

{{-- 模板的注释语法 --}}

控制语句

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
# if else
@if()
@elseif()
@else
@endif

# 判断子组件是否复写section
@hasSection('title')
@else
@endif

# 需要注意的是,if else是不能写在一行的如果非要写在同一行,建议使用这样的方法
{!! isset($a) && $a['a'] == 'a' ? 'disabled': '' !!}

# 循环for
@for ($i = 0; $i < 10; $i++)
The current value is {{ $i }}
@endfor

# 循环foreach
@foreach ($users as $user)
$loop->index # 循环当前的索引
$loop->iteration # 当前循环的指针
$loop->remaining # 循环剩余的指针
$loop->count # 循环总数量
$loop->first # 是否第一个元素
$loop->last # 是否最后一个元素
$loop->even # 奇数
$loop->odd # 偶数
$loop->depth # 多层嵌套循环的深度
$loop->parent # 父循环的$loop

@continue # continue语法
@continue(type == 1) # 直接将条件写到continue中
@break # break语法
@break($user->number == 5) # 直接将条件写到break中
@endforeach

# 循环forelse,直接把为空的情况判断了
@forelse ($users as $user)
<li>{{ $user->name }}</li>
@empty
<p>No users</p>
@endforelse

# 循环while
@while (true)
<p>I'm looping forever.</p>
@endwhile

模板关系

  • Laravel中我们通常会写一个基本的layout模板,然后其它的页面都继承自它

下面是一个例子:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
// layout.blade.php
<html>
<head>
<title>App Name - @yield('title')</title>

@hasSection('title') # 判断子组件是否有复写这个section
@yield('title') - Site Name
@else
Site Name
@endif
@stack('css') # 定义一个堆,子组件可以多次push内容进去,会以堆的顺序堆放
</head>
<body>
@section('sidebar')
This is the master sidebar.
@show

<div class="container">
@yield('content')
</div>
</body>
</html>

// home.blade.php
@inject('userService', 'App\Services\UserService') // 服务注入
{{ $userService->getUsername() }}

@extends('layout') // 声明该模板继承自基本的layout.blade.php模板

@section('title', 'Page Title')

@section('sidebar')
@parent // 可以直接使用父模版中的内容
<p>This is appended to the master sidebar.</p>
@endsection

@push('css') // 向堆stack中压入内容
@endpush

@section('content') // 编写父模板中content的具体内容
<h1>Home Page</h1>
@include('child') // 引入子视图,子模板会和父模板共享变量
@include('child', ['data' => []]) // 可以传递额外的变量给子模板
@endsection

渲染

1
view('users', compact('user'))->render();	// 直接将模板生成字符串

Vue component

1
<my-component :user="{{ json_encode($user->toArray) }}"></my-component>	<!--传递值到vue component去-->
坚持原创技术分享,谢谢支持

欢迎关注我的其它发布渠道