Laravel 框架中的 Blade 模板引擎，很好用，但是在官方文档中有关 Blade 的介绍并不详细，有些东西没有写出来，而有些则是没有说清楚。比如，使用中可能会遇到这样的问题：
1.@yield 和 @section 都可以预定义可替代的区块，这两者有什么区别呢？
2.@section 可以用 @show, @stop, @overwrite 以及 @append 来结束，这三者又有什么区别呢？
本文试对这些问题做一个比较浅显但是直观的介绍。
@yield 与 @section
首先，@yield 是不可扩展的，如果你要定义的部分没有默认内容让子模板扩展的，那么用 @yield($name, $default) 的形式会比较方便，如果你在子模板中并没有指定这个区块的内容，它就会显示默认内容，如果定义了，就会显示你定义的内容。非此即彼。
与之相比， @section 则既可以被替代，又可以被扩展，这是最大的区别。比如：
代码如下:
{{-- layout.master --}}
@yield('title','默认标题')
@section('content')
默认的内容
@show
代码如下:
{{-- home.index --}}
@extends('layout.master')
@section('title')
@parent
新的标题
@stop
@section('content')
@parent
扩展的内容
@stop
上面的例子中，模板用 @yield 和 @section 分别定义了一个区块，然后在子模板中去定义内容，由于 @yield 不能被扩展，所以即使加上了 @parent 也不起作用，输出的内容只有“新的标题”，替换了“默认的标题”。因此最终生成的页面只能是“默认的标题”或者“新的标题”，不能并存。而 @section 定义的部分，由于使用了 @parent 关键字，父模板中的内容会被保留，然后再扩展后添加的内容进去，输出的内容会是 “默认的内容 扩展的内容”。
官方网站上的文档中并没有涉及 @parent关键字，说的是默认行为是“扩展”，要覆盖需要用 @override 来结束，这是错的，[github 上的最新文档][docs] 已经做了修正。@section 加上 @stop，默认是替换（注入），必须用 @parent 关键字才能扩展。而@override 关键字实际上有另外的应用场景。
@show 与 @stop
接下来再说说与 @section 对应的结束关键字，@show, @stop 有什么区别呢？（网上的部分文章，以及一些编辑器插件还会提示 @endsection, 这个在 4.0 版本中已经被移除，虽然向下兼容，但是不建议使用）。
@show 指的是执行到此处时将该 section 中的内容输出到页面，而 @stop 则只是进行内容解析，并且不再处理当前模板中后续对该section的处理，除非用 @override覆盖（详见下一部分）。通常来说，在首次定义某个 section 的时候，应该用 @show，而在替换它或者扩展它的时候，不应该用 @show，应该用 @stop。下面用例子说明：
代码如下:
{{-- layout.master --}}
@section('zoneA')
AAA
@show
@section('zoneB')
BBB
@stop
@section('zoneC')
CCC
@show
The code is as follows:
{{-- page.view --}}
@extends('layout.master')
@section('zoneA')
aaa
@stop
@section('zoneB')
bbb
@stop
@section('zoneC')
ccc
@show
In layout.master, use @stop to end "zoneB". Since there is no definition of "zoneB" ending with @show in the entire template system, this block will not be displayed. In page.view, 'zoneC' is defined with @show, which will display the content immediately when the execution reaches here, and continue to overwrite the content according to the template inheritance mechanism, so the final displayed content will be:
Copy the code The code is as follows:
ccc // from page.view
aaa
ccc
As you can see from the results, the content of zoneB is lost because @show is not used to tell the engine to output this part of the content, while the content of zoneC will be displayed twice, and the page structure of layout.master is also destroyed because @show Appeared twice.
@append and @override
As mentioned just now, @override does not specify content in the child template to replace the default content of the parent template, but has another purpose. So how to use it? This again involves the issue that a section can be used multiple times in a template. That is to say, each section we define can actually appear multiple times in subsequent sub-templates. For example:
The code is as follows:
{{-- master --}}
@yield('content')
The code is as follows:
{{-- subview --}}
@extends('master')
@section('content')
Add a line of content
@append
@section('content')
Add one more line
@append
@section('content')
Enough has been added, call it a day.
@stop
In the above example, I only defined a section named "content" in the parent template, and specified the content of this section three times in the child template. The final output of this example is:
The code is as follows:
Add a line of content
Add one more line
Enough has been added, call it a day.
The content specified three times is displayed. The key lies in the @append keyword, which indicates "the content here is added to", so the content will continue to expand. And @stop is used at the end, indicating that the processing of this section ends here. If you continue to use @append or @stop to specify the content of this section, it will not take effect. Unless handled with @override. @override means "overwrite all previous definitions, and this one will prevail." For example:
The code is as follows:
{{-- master --}}
@yield('content')
@yield('message')
The code is as follows:
{{-- master --}}
@section('content')
Add a line of content
@append
@section('content')
Add one more line
@append
@section('content')
Enough has been added, let’s finish
@stop
@section('content')
No more, I said.
@override
This example is similar to the previous one, except that a set of definitions is added at the end. The final output will be:
The code is as follows:
No more, I said.
Therefore, in a formal project, sometimes if you need to traverse and output data, you can use @append. But what if you traverse a certain data and find that the previous ones are all wrong? Use @override to override them all.
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
