Home >PHP Framework >Laravel >What is a Blade template?

What is a Blade template?

coldplay.xixiOriginal: 2020-07-02 10:55:483345browse

Blade template is a template engine provided by Laravel. It is simple and powerful. Blade allows the use of native PHP code in views. Laravel uses compiled cache files instead of the view itself, so Blade is very useful for applications. It's zero overhead.

Blade template is:

Blade is a template engine provided by Laravel. It is simple and powerful. Unlike other PHP template engines, Blade allows the use of native PHP code in views.

In fact, all Blade views will eventually be compiled into native PHP code and cached in the storage/framework/views folder.

Laravel uses these compiled cache files, not the views themselves, so Blade has zero overhead for the application. When you modify a view file, it is recompiled and cached for use. Blade views have the suffix name of blade.php and are generally stored in the resources/views folder.

Template inheritance:

1. Define layout file

The main two advantages of Blade template engine are "template inheritance" ” and “Block.” To give a simple example, in a project, almost all pages have the same layout. At this time, this layout can be extracted and used as a master page. All pages that inherit this master page will have the same layout effect. , becoming a child page of the master page. The master page is also called a layout file, and the layout file is a Blade view:

<!-- Stored in resources/views/layouts/app.blade.php -->
<html>
       <head>
             <title>App Name - @yield(&#39;title&#39;)</title>
       </head>
       <body>
         @section(&#39;sidebar&#39;)
               This is the master sidebar.
         @show
         <div class="container">
              @yield(&#39;content&#39;)
         </div>
       <body>
</html>

In addition to the basic HTNL tags, the layout file also uses two instructions: @section and @yield. @section defines the block, and @yield defines the content in the block.

under. to define subpages of the layout file.

2. Inherit the layout file

In the subpage, use Blade's @extends directive to specify the "inherited" layout file, and use the @section directive to specify the "inherited" layout file in the layout file. Inject content where the @section and @yield directives are used:

<!-- Stored in resources/views/child.blade.php -->
@extends(&#39;layouts.app&#39;)
@section(&#39;title&#39;,&#39;Page Title&#39;)
@section(&#39;sidebar&#39;)
       <p> This is appended to the master sideebar</p>
@endsection
@section(&#39;content&#39;)
         <p>This ismy body content. </p>
@endsection

You can see that where the @yield directive is used in the layout file, @section is still used to inject content in the subpage; in the layout file, use One benefit of the @section directive definition is that when using @section injection in child pages, you can use the @parent directive to append (rather than overwrite) the content in the layout file where the @yield directive is used in the layout file. It can't be done. The @parent directive will be replaced with the content in the layout file when the view is rendered.

Note that, unlike the sidebar defined in the file layout, the subpage is ended with @endsection instead of @show. Because @endsection is only used to define blocks, and @show is used to define and immediately generate blocks.

To return the view file directly from the route, you need to use the global auxiliary function helper:

Route::get(&#39;blade&#39;, function(){
        return view(&#39;child&#39;);
})

3, Component & Slot

Component and slot Slots provide similar benefits to layouts and blocks. The mental model of components and slots is more intuitive. Imagine that we have a repeatable "pop-up box" component in our project:

<!-- Stored resource/views/alter.blade.php -->
<div class="alter alter-danger">
       {{ $slot }}
</div>

{{ $slot }} represents the content of the inserted component. To build this component, use Blade's @component directive:

@component(&#39;alter&#39;)
        <strong>Whoops!</strong> Something went wrong!
@endcomponent

In this scenario, {{ $slot }} The content of the variable is:

<strong>Whoops! </strong> Something went wrong!

Sometimes one Components require multiple slots. At this time, you only need to slightly change the component code and define a "title" slot, which is called a named slot. Named slots display content by simply "printing" the variable matching its name:

<!-- Stored resources/views/alter.blade.php-->
<div class="alter alter-danger">
         <div class="alter-title">{{ $title }}</div>
            {{ $slot }}
</div>

To inject content into a named slot, use the @slot directive. All content not in the @slot directive will be passed to the $slot variable in the component.

@compontent (&#39;alter&#39;)
         @slot(&#39;title&#39;)
            Forbidden
         @endslot
     You are not allowed to access this resource!
@edcompontent~

4. Pass additional data for the component:

Sometimes it is necessary to pass additional data for the component. To do this, you can pass a second array argument to the @conponent directive. Specify extras to pass. All past additional data can be used as variables in the component template:

@component
     <compontent(&#39;alter&#39;, [&#39;foo&#39; => &#39;bar&#39;);
         .....
@endCompontent

5. Display data

Transfer data to the Blade view by passing The variable is wrapped in [ ] :

Route::get(&#39;greeting&#39;, function(){
         return view(&#39;welcome&#39;, [ &#39;name&#39; => &#39;&#39;Samantha&#39;]);
})

You can use the name variable to display the content:

Hello! {{ $name }}

{{ }} Yes Blade view's print statement. Of course, the print statement is not limited to printing variable contents, and PHP functions can also be used. In fact, any PHP code can be used in the print statement here:

The current UNIX timestamp is {{ time() }}

6. Display non-transferred data

By default, all is passed to Blade {{ }} The content of the statement will be processed using the htmlspecialchar function to escape the content to avoid XSS attacks. If there is no need to escape the output content, you can use the following syntax:

Hello! {{!! $name !!}}.

But be careful, you should give priority to using the escaped {{ }} syntax to avoid XXS attacks. Because sometimes it is difficult to avoid intentional or unintentional data input by users.

Related learning recommendations: Laravel

The above is the detailed content of What is a Blade template?. For more information, please follow other related articles on the PHP Chinese website!

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：Laravel-S can actually improve such high performance!Next article：Laravel-S can actually improve such high performance!

See more

What is a Blade template?

Related articles