Introduction to the differences between some section tags in Laravel template engine Blade, laravelblade

Introduction to the differences between some section tags in Laravel template engine Blade, laravelblade_PHP tutorial

WBOY

Release： 2016-07-13 10:07:06

Original

872 people have browsed it

Introduction to the differences between some section tags in Laravel template engine Blade, laravelblade

The Blade template engine in the Laravel framework is very easy to use, but the introduction of Blade in the official documentation is not detailed, some things are not written, and some are not clearly explained. For example, you may encounter the following problems during use:

1. Both @yield and @section can predefine replaceable blocks. What is the difference between the two?
2. @section can be ended with @show, @stop, @overwrite and @append. What is the difference between these three?

This article attempts to give a relatively simple but intuitive introduction to these issues.

@yield and @section

First of all, @yield is not extensible. If the part you want to define does not have default content for the subtemplate to expand, then it will be more convenient to use @yield($name, $default). If you are in the subtemplate If the content of this block is not specified, it will display the default content. If it is defined, it will display the content you define. It’s either/or.

In contrast, @section can both be replaced and extended. This is the biggest difference. For example:

Copy code The code is as follows:

{{-- layout.master --}}
@yield('title','default title')

@section('content')
Default content
@show

Copy code The code is as follows:

{{-- home.index --}}
@extends('layout.master')

@section('title')
@parent
New title
@stop

@section('content')
@parent
Expanded content
@stop

In the above example, the template uses @yield and @section to define a block respectively, and then defines the content in the sub-template. Since @yield cannot be expanded, even adding @parent will not work. The output content is only the "new title", replacing the "default title". Therefore, the final generated page can only be "default title" or "new title", but not both. As for the part defined by @section, due to the use of the @parent keyword, the content in the parent template will be retained, and then the content added after expansion will be added, and the output content will be "default content expanded content".

The @parent keyword is not involved in the documentation on the official website. It says that the default behavior is "expand". To override it, you need to end it with @override. This is wrong, [latest documentation on github][docs ] Corrections have been made. @section plus @stop, the default is replacement (injection), and the @parent keyword must be used to expand. The @override keyword actually has another application scenario.

@show and @stop

Next, let’s talk about the end keyword corresponding to @section. What is the difference between @show and @stop? (Some articles on the Internet and some editor plug-ins will also prompt @endsection. This has been removed in version 4.0. Although it is backward compatible, its use is not recommended).

@show refers to outputting the content in the section to the page when execution reaches this point, while @stop only performs content parsing and will no longer process subsequent processing of the section in the current template unless @override is used Coverage (see next section for details). Generally speaking, when defining a section for the first time, @show should be used. When replacing or extending it, @show should not be used, but @stop should be used. Below is an example:

Copy code The code is as follows:

@section('zoneA')
AAA
@show

@section('zoneB')
BBB
@stop

@section('zoneC')
CCC
@show

Copy code 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 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:

Copy code The code is as follows:

@yield('content')

Copy code 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:

Copy code 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:

Copy code The code is as follows:

@yield('content')
@yield('message')

Copy code The code is as follows:

@section('content')
Add a line of content
@append
@section('content')
Add another line of content
@append
@section('content')
Enough has been added, let’s finish
@stop
@section('content')
No more, I said so.
@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:

Copy code 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.