Klingenvorlage


Klinge Vorlage

Einführung

Klinge Es handelt sich um eine einfache, aber leistungsstarke Template-Engine, die von Laravel bereitgestellt wird. Im Gegensatz zu anderen beliebten PHP-Template-Engines schränkt Blade Sie nicht bei der Verwendung von nativem PHP-Code in Ihren Ansichten ein. Alle Blade-Ansichtsdateien werden in nativen PHP-Code kompiliert und zwischengespeichert und erst dann neu kompiliert, wenn sie geändert werden. Dies bedeutet, dass Blade Ihre Anwendung grundsätzlich nicht belastet. Blade-View-Dateien verwenden .blade.php als Dateierweiterung und werden im Verzeichnis resources/views gespeichert.

Vorlagenvererbung

Layout definieren

Die beiden Hauptvorteile von Blade sind 模板继承 und 区块. Beginnen wir zunächst mit einem einfachen Beispiel. Schauen wir uns zunächst das Layout der „Hauptseite“ an. Da die meisten Webanwendungen auf verschiedenen Seiten dasselbe Layout verwenden, ist es einfach, eine einzelne Blade-Layoutansicht zu definieren: 

<!-- 保存在  resources/views/layouts/app.blade.php 文件中 -->
<html>   
 <head>      
   <title>App Name - @yield('title')</title>    
 </head>   
 <body>
    @section('sidebar')
     This is the master sidebar.
     @show       
     <div class="container">
     @yield('content')       
      </div>   
  </body>
</html>

Wie Sie sehen können, enthält diese Datei typische HTML-Syntax. Bitte beachten Sie jedoch die Anweisungen @section und @yield. Die @section-Direktive definiert einen Teil des Inhalts der Ansicht, und die @yield-Direktive wird verwendet, um den angegebenen Teil des Inhalts anzuzeigen.

Nachdem wir nun das Layout dieser Anwendung definiert haben, definieren wir eine Unterseite, die dieses Layout erbt.

Erweitertes Layout

Verwenden Sie beim Definieren einer Unteransicht die @extends-Direktive von Blade, um die Unteransicht auf „Geerbt“ festzulegen " Sicht. Ansichten, die das Blade-Layout erweitern, können mithilfe der @section-Direktive Inhalte in Layoutfragmente einfügen. Wie im vorherigen Beispiel gezeigt, wird der Inhalt dieser Fragmente in dem von der @yield-Direktive gesteuerten Layout angezeigt: 

<!-- 保存在 resources/views/child.blade.php 中 -->
@extends('layouts.app')
@section('title', 'Page Title')
@section('sidebar')
    @parent    
    <p>This is appended to the master sidebar.</p>
    @endsection
@section('content')   
 <p>This is my body content.</p>
@endsection

In diesem Beispiel verwendet das sidebar-Fragment die @parent-Direktive für The Die Seitenleiste des Layouts fügt Inhalte hinzu (anstatt sie zu überschreiben). Beim Rendern der Ansicht werden die @parent-Anweisungen durch den Inhalt im Layout ersetzt.

{tip} Im Gegensatz zum vorherigen Beispiel endet hier das sidebar-Fragment mit @endsection statt mit @show. Die @endsection-Direktive definiert nur ein Fragment und @show wird dieses Fragment sofort ausgeben, wenn es definiert ist.

Blade View kann den globalen view-Helfer verwenden, um von der Route zurückzukehren: 

Route::get('blade', function () {  
  return view('child');
});

Komponente & Slots

Komponenten und Slots bieten ähnliche Vorteile wie Fragmente und Layouts, das mentale Modell von Komponenten und Slots ist jedoch einfacher zu verstehen. Schauen wir uns zunächst eine wiederverwendbare „Alert“-Komponente an, die wir in unserer Anwendung wiederverwenden möchten: 

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

{{ $slot }} Die Variable enthält den Inhalt, den wir in die Komponente einfügen möchten. Jetzt erstellen wir diese Komponente mit der @component-Direktive von Blade: 

@component('alert') 
<strong>Whoops!</strong> Something went wrong!
@endcomponent

Manchmal ist es nützlich, mehrere Steckplätze für eine Komponente zu definieren. Ändern Sie die Warnkomponente, damit sie „Titel“ einfügen kann. Benannte Slots können über die entsprechende „echo“-Variable angezeigt werden: 

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

Wir können jetzt mithilfe der @slot-Direktive Inhalte in benannte Slots einfügen. Inhalte, die nicht in der @slot-Direktive enthalten sind, werden an die $slot-Variable in der Komponente übergeben: 

@component('alert')
    @slot('title')
        Forbidden
    @endslot
You are not allowed to access this resource!@endcomponent

Übergabe zusätzlicher Daten an die Komponente

Manchmal müssen Sie möglicherweise zusätzliche Daten an die Komponente übergeben. In diesem Fall können die enthaltenen Daten als zweiter Parameter der @component-Direktive in einem Array organisiert werden. Alle Daten werden der Komponentenvorlage als Änderungen bereitgestellt: 

@component('alert', ['foo' => 'bar'])  
  ...
@endcomponent

Aliasing der Komponenten

Wenn die Komponenten in einem Unterverzeichnis gespeichert sind, möchten Sie ihnen möglicherweise ein Alias ​​zuweisen Alias ​​für einfachen Zugriff. Wenn beispielsweise eine Blade-Komponente in resources/views/components/alert.blade.php gespeichert ist, können Sie die Methode component verwenden, um components.alert als Alias ​​für alert festzulegen. . Normalerweise findet dieser Vorgang innerhalb von AppServiceProvider von boot statt Erledigt in der Methode: 

use Illuminate\Support\Facades\Blade;
Blade::component('components.alert', 'alert');

Sobald die Komponente einen Alias ​​hat, können Sie sie mit einer einzigen Anweisung rendern: 

@alert(['type' => 'danger'])
    You are not allowed to access this resource!@endalert

Wenn Sie keinen zusätzlichen Steckplatz haben, können Sie auch speichern Ausgelassene Komponentenparameter: 

@alert
    You are not allowed to access this resource!@endalert

Anzeigedaten

können übergeben werden Blade-Ansichtsdaten. Wenn beispielsweise die folgende Route angegeben ist: 

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

, können Sie die Variable name verwenden, um ihren Inhalt anzuzeigen: 

Hello, {{ $name }}.

{tip} Die Blade-Anweisung {{ }} wird automatisch ausgeführt durch PHPs htmlspecialchars Function Passing geleitet, um XSS-Angriffe zu verhindern.

Sie können nicht nur den Inhalt der an die Ansicht übergebenen Variablen anzeigen, sondern auch die Ergebnisse jeder beliebigen PHP-Funktion anzeigen. Tatsächlich können Sie jeden gewünschten PHP-Code in die Echo-Anweisung von Blade einfügen: 

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

Nicht maskierte Zeichen anzeigen

Standardmäßig wird die {{ }}-Anweisung von Blade automatisch übergeben durch die htmlspecialchars-Funktion von PHP, um XSS-Angriffe zu verhindern. Wenn Sie nicht möchten, dass die Daten maskiert werden, können Sie die folgende Syntax verwenden: 

Hello, {!! $name !!}.

{note} Seien Sie vorsichtig, wenn Sie vom Benutzer Ihrer Anwendung bereitgestellte Inhalte wiedergeben. Beim Anzeigen von vom Benutzer bereitgestellten Daten ist zum Schutz vor XSS-Angriffen immer die Syntax-Escape-Funktion mit doppelten geschweiften Klammern zu verwenden.

JSON rendern

Um eine JavaScript-Variable zu initialisieren, übergeben Sie manchmal Daten an die Ansicht und rendern sie in JSON: 

<script>  
  var app = <?php echo json_encode($array); ?>;
</script>

Sie können jedoch den @json Blade-Befehl verwenden, anstatt json_encode manuell aufzurufen Funktionen: 

<script> 
   var app = @json($array);
</script>

HTML-Entitätskodierung

Standardmäßig kodiert Blade (und Laravel's e-Helfer) HTML-Entitäten doppelt. Wenn Sie die doppelte Kodierung deaktivieren möchten, können Sie die Methode AppServiceProvider in boot von Blade::withoutDoubleEncoding aufrufen: 

<?php
   namespace App\Providers;
   use Illuminate\Support\Facades\Blade;
   use Illuminate\Support\ServiceProvider;
   class AppServiceProvider extends ServiceProvider{   
    /**
     * 引导任意应用服务。
     *
     * @return void
     */  
   public function boot()   
    {       
     Blade::withoutDoubleEncoding();   
     }
  }

Blade & JavaScript Framework

Da viele JavaScript-Frameworks auch geschweifte Klammern verwenden, um anzuzeigen, dass ein bestimmter Ausdruck im Browser angezeigt wird, können Sie das Symbol @ verwenden, um der Blade-Rendering-Engine mitzuteilen, dass a Ein bestimmter Ausdruck sollte konstant gehalten werden. Ein Beispiel lautet wie folgt: 

<h1>Laravel</h1>Hello, @{{ name }}.

In diesem Beispiel wird das @-Symbol von Blade entfernt; der {{ name }}-Ausdruck bleibt in der Blade-Engine unverändert und stattdessen rendert die JavaScript-Engine den Ausdruck .

@verbatim-Direktive

Wenn Sie JavaScript-Variablen in einem großen Abschnitt der Vorlage verwenden möchten, können Sie den HTML-Code in die @verbatim-Direktive einschließen Sie müssen nicht für jeden hinzugefügten Abschnitt @ JavaScript-Variablen hinzufügen Symbole: 

@verbatim   
 <div class="container">
        Hello, {{ name }}.  
  </div>@endverbatim

Kontrollstruktur

Zusätzlich zur Vorlagenvererbung und Datenanzeige bietet Blade auch PHP-Unterstützung für Verzweigungen und Schleifen usw. Kontrollstrukturen bieten praktische Verknüpfungen. Diese Verknüpfungen bieten eine saubere und einfache Möglichkeit, mit PHP-Kontrollstrukturen zu arbeiten und gleichzeitig die Ähnlichkeit zu ihren Gegenstücken in PHP beizubehalten.

If-Anweisung

kann @if, @elseif, @else und @endif verwenden Anweisungen Konstruieren Sie die if-Anweisung. Diese Direktiven funktionieren identisch mit den entsprechenden PHP-Direktiven: 

@if (count($records) === 1)  
  I have one record!
@elseif (count($records) > 1)   
   I have multiple records!
@else  
    I don't have any records!
 @endif

Der Einfachheit halber stellt Blade auch die @unless-Direktive bereit: 

@unless (Auth::check())
    You are not signed in.@endunless

Zusätzlich zu den bereits besprochenen bedingten Direktiven @isset und @empty Befehle können als entsprechendes PHP verwendet werden Funktionsverknüpfungen: 

@isset($records) 
   // $records 被定义且不是 null...
@endisset

@empty($records)   
 // $records 为空...
@endempty

Authentifizierungsanweisungen Die Anweisungen

@auth und @guest können verwendet werden, um schnell festzustellen, ob der aktuelle Benutzer authentifiziert oder ein Besucher ist: 

@auth    // 此用户身份已验证...@endauth
@guest    // 此用户身份未验证...@endguest

kann bei Bedarf @auth und @guest verwenden Geben Sie die Identität an, die beim Befehlen überprüft werden soll: 

@auth('admin')    // 此用户身份已验证...@endauth
@guest('admin')    // 此用户身份未验证...@endguest

Fragmentbefehl

kann verwendet werden @hasSection Der Befehl prüft, ob das Fragment Inhalt hat: 

@hasSection('navigation')
   <div class="pull-right">
 @yield('navigation')   
    </div>  
    <div class="clearfix">
    </div>
 @endif

Umschaltbefehl

kann verwendet werden @switch, @case, @break, @default und @endswitch Anweisungen konstruieren Schalter Satz: 

@switch($i)
    @case(1)
        First case...
        @break
    @case(2)
        Second case...
        @break
    @default   
        Default case...@endswitch

Schleifen

Zusätzlich zu Verzweigungsanweisungen bietet Blade auch vereinfachte Anweisungen, die mit der Schleifenstruktur von PHP identisch sind. Auch diese Anweisungen funktionieren genauso wie die entsprechenden PHP-Anweisungen: 

@for ($i = 0; $i < 10; $i++)
    The current value is {{ $i }}
 @endfor
@foreach ($users as $user)   
 <p>This is user {{ $user->id }}</p>
@endforeach
@forelse ($users as $user)   
 <li>{{ $user->name }}</li>
 @empty   
 <p>No users</p>
@endforelse
@while (true)  
  <p>I'm looping forever.</p>
 @endwhile

{tip} Schleifenvariablen können in Schleifen verwendet werden Erhalten Sie auswertbare Informationen über die Schleife, z. B. ob Sie sich in der ersten Iteration oder der letzten Iteration der Schleife befinden:

In der Schleife können Sie die Schleife auch beenden oder diese Iteration durchlaufen: 

@foreach ($users as $user)
    @if ($user->type == 1)
        @continue
    @endif    
     <li>{{ $user->name }}</li>
    @if ($user->number == 5)
        @break
    @endif@endforeach

Sie können Anweisungen auch mit Bedingungen in einer Zeile deklarieren: 

@foreach ($users as $user)
    @continue($user->type == 1)   
     <li>{{ $user->name }}</li>
    @break($user->number == 5)
  @endforeach

Schleifenvariable

Während der Schleife , Im Schleifenkörper ist eins verfügbar $loopVariablen. Diese Variable bietet Zugriff auf eine kleine Menge nützlicher Informationen, wie den Index der aktuellen Schleife und ob es sich um die erste oder letzte Schleife handelt: 

@foreach ($users as $user)
    @if ($loop->first)
        This is the first iteration.
    @endif

    @if ($loop->last)
        This is the last iteration.
    @endif  
      <p>This is user {{ $user->id }}</p>
  @endforeach

In verschachtelten Schleifen können Sie parent Attributzugriff auf übergeordnete Schleifen verwenden $loop Variable: 

@foreach ($users as $user)
    @foreach ($user->posts as $post)
        @if ($loop->parent->first)
            This is first iteration of the parent loop.
        @endif
    @endforeach@endforeach

$loop Die Variable enthält auch mehrere andere nützliche Attribute:

属性描述
$loop->index当前迭代的索引（从 0 开始计数）。
$loop->iteration当前循环迭代 (从 1 开始计算）。
$loop->remaining循环中剩余迭代的数量。
$loop->count被迭代的数组元素的总数。
$loop->first是否为循环的第一次迭代。
$loop->last是否为循环的最后一次迭代。
$loop->depth当前迭代的嵌套深度级数。
$loop->parent嵌套循环中，父循环的循环变量

Anmerkungen

Blade ermöglicht auch die Definition von Anmerkungen in Ansichten. Im Gegensatz zu HTML-Kommentaren sind Blade-Kommentare jedoch nicht im an die Anwendung zurückgegebenen HTML-Code enthalten: 

{{-- This comment will not be present in the rendered HTML --}}

PHP

In manchen Fällen ist es sinnvoll, PHP-Code in die Ansicht einzubetten. Sie können die @php-Direktive in einer Vorlage verwenden, um native PHP-Codeblöcke auszuführen: 

@php    //@endphp

{tip} Obwohl Blade diese Funktion bereitstellt, führt eine häufige Verwendung dazu, dass zu viel Logik in die Vorlage eingebettet ist.

Formular

CSRF Felder

Solange in der Anwendung ein HTML-Formular definiert ist, muss das versteckte CSRF-Token-Feld im Formular enthalten sein, damit die CSRF-Schutz-Middleware die Anfrage überprüfen kann. Sie können die @csrf-Anweisung von Blade verwenden, um das Token-Feld zu generieren: 

<form method="POST" action="/profile">
    @csrf   
    ...
</form>

Methodenfeld

HTML-Formular nicht PUT, PATCH und DELETE gesendet werden Anfragen müssen versteckte _method-Felder enthalten, um diese HTTP-Verben nachzuahmen. Der @method-Befehl von Blade kann Ihnen beim Erstellen dieses Felds helfen: 

<form action="/foo/bar" method="POST">
    @method('PUT')    
    ...
</form>

Introducing subviews

Blade's< The 🎜> Mit der Direktive können Sie Blade-Ansichten aus anderen Ansichten importieren. Alle in der übergeordneten Ansicht verfügbaren Variablen sind auch in der eingeschlossenen Ansicht verfügbar: @include

<div>
    @include('shared.errors')   
   <form>       
    <!-- Form Contents -->    
  </form>
</div>

Die eingeschlossene Ansicht erbt nicht nur alle verfügbaren Daten von der übergeordneten Ansicht, sondern kann auch zusätzliche Daten an die eingeschlossene Ansicht im Formular übergeben eines Arrays. Daten: 

@include('view.name', ['some' => 'data'])

Wenn sie an

eine nicht vorhandene Ansicht übergeben werden, gibt Laravel einen Fehler aus. Um eine Ansicht einzuschließen, deren Existenz nicht bestimmt werden kann, verwenden Sie die @include-Direktive: @includeIf

@includeIf('view.name', ['some' => 'data'])

. Um eine Ansicht einzuschließen, die von einer bestimmten booleschen Bedingung abhängt, verwenden Sie die

-Direktive: @includeWhen

@includeWhen($boolean, 'view.name', ['some' => 'data'])

Um die erste vorhandene Ansicht in ein bestimmtes Ansichtsarray einzuschließen, können Sie

verwenden Anweisung: includeFirst

@includeFirst(['custom.admin', 'admin'], ['some' => 'data'])

{note} Sie sollten versuchen, die Verwendung der magischen Konstanten

und __DIR__ in Blade-Ansichten zu vermeiden, da diese auf den Speicherort der kompilierten Ansicht im Cache verweisen. __FILE__

Geben Sie den eingeschlossenen Ansichten Aliase

Wenn Ihre in Blade enthaltenen Ansichten in Unterverzeichnissen gespeichert sind, möchten Sie ihnen möglicherweise Aliase geben, auf die leicht zugegriffen werden kann. Beispielsweise wird ein Blade-Ansichtsinhalt mit dem folgenden Inhalt in einer resources/views/includes/input.blade.php-Datei gespeichert: 

<input type="{{ $type ?? 'text' }}">

kann die include-Methode verwenden, um includes.input einen Alias ​​namens input zu geben. Normalerweise geschieht dies in der AppServiceProvider-Methode von boot: 

use Illuminate\Support\Facades\Blade;
Blade::include('includes.input', 'input');

Sobald die enthaltene Ansicht einen Alias ​​hat, kann sie wie Blade mit einem Alias ​​versehen werden Dieselbe Anweisung wird zum Rendern mit einem Alias ​​verwendet: 

@input(['type' => 'email'])

Um eine Ansicht für eine Sammlung zu rendern

Sie können Blades @each verwenden Die Direktive kombiniert Schleifen und Inklusion in einer Zeile: 

@each('view.name', $jobs, 'job')

Der erste Parameter ist ein Ansichtsfragment, das jedes Element des Arrays oder der Sammlung rendert. Der zweite Parameter ist das Array oder die Sammlung, über die Sie iterieren möchten, und der dritte Parameter ist der Name der Variablen, die der aktuellen Iteration in der Ansicht zugewiesen wird. Wenn Sie beispielsweise über ein jobs-Array iterieren möchten, greifen Sie normalerweise über eine job-Variable im Ansichtsfragment auf jede Aufgabe zu. Der Schlüssel der aktuellen Iteration wird als Variable key im Ansichtsfragment verwendet.

kann auch als viertes Argument an die @each-Direktive übergeben werden. Dieser Parameter ist das Ansichtsfragment, das gerendert werden soll, wenn das angegebene Array leer ist. 

@each('view.name', $jobs, 'job', 'view.empty')

{note} Mit der gerenderten Ansicht @each können Variablen nicht von der übergeordneten Ansicht geerbt werden. Wenn eine Unteransicht diese Variablen erfordert, muss sie stattdessen @foreach und @include verwenden.

Stapel

Blade ermöglicht es Ihnen, Ansichten auf den Stapel zu verschieben, die für andere Zwecke verwendet werden können Ansichten oder wird im Layout gerendert. Dies ist nützlich, wenn Sie erforderliche JavaScript-Bibliotheken in Unteransichten angeben: 

@push('scripts')  
  <script src="/example.js">
  </script>
@endpush

Sie können bei Bedarf mehrmals auf den Stapel pushen. Das Rendern des Stapelinhalts wird abgeschlossen, indem der Stapelname an die @stack-Direktive übergeben wird: 

<head> 
   <!-- 头部内容 -->
    @stack('scripts')
 </head>

Wenn Sie den Inhalt oben im Stapel voreinstellen möchten, müssen Sie die @prepend-Direktive verwenden: 

@push('scripts')
    This will be second...@endpush// 然后...
  @prepend('scripts')
    This will be first...
  @endprepend

Service Die inject

@inject-Direktive kann verwendet werden, um Dienste aus dem Service-Container von Laravel abzurufen. Der erste an @inject übergebene Parameter ist der Name der zu platzierenden Dienstvariablen und der zweite Parameter ist der Name der Klasse oder Schnittstelle, die aufgelöst werden soll: 

@inject('metrics', 'App\Services\MetricsService')
<div>
    Monthly Revenue: {{ $metrics->monthlyRevenue() }}.</div>

Extension Blade

Blade ermöglicht es Ihnen, Anweisungen mithilfe der directive-Methode anzupassen. Wenn der Blade-Compiler auf eine benutzerdefinierte Direktive stößt, ruft dieser den Rückruf auf, der durch den in der Direktive enthaltenen Ausdruck bereitgestellt wird.

Das folgende Beispiel erstellt die @datetime($var)-Direktive, eine Instanz von DateTime, die das angegebene $var formatiert: 

<?php
  namespace App\Providers;
  use Illuminate\Support\Facades\Blade;
  use Illuminate\Support\ServiceProvider;
  class AppServiceProvider extends ServiceProvider{  
     /**
     * 执行注册后引导服务.
     *
     * @return void
     */   
   public function boot()  
     {       
        Blade::directive('datetime', function ($expression) {           
        return "<?php echo ($expression)->format('m/d/Y H:i'); ?>";       
      });    
    }   
    /**
     * 在容器中注册绑定.
     *
     * @return void
     */ 
      public function register()  
        { 
             //    
         }
      }

Wie Sie sehen können, werden wir es an die Direktivenkette übergeben Aufrufe der format-Methode in einem beliebigen Ausdruck. In diesem Beispiel generiert die Direktive den folgenden nativen PHP-Code: 

<?php echo ($var)->format('m/d/Y H:i'); ?>

{note} Nach dem Aktualisieren der Logik der Blade-Direktive sind alle Caches der Blade-Ansicht erforderlich. Der Blade-View-Cache kann mit dem Artisan-Befehl view:clear gelöscht werden.

Benutzerdefinierte If-Anweisung

Wenn Sie einfache, benutzerdefinierte bedingte Anweisungen definieren, schreiben Sie Ihre eigene Definieren einer Direktive ist komplexer als die notwendigen Schritte. In diesem Fall stellt Blade die Methode Blade::if bereit, mit der Sie schnell bedingte Anweisungen mithilfe von Abschlüssen definieren können. Um beispielsweise eine benutzerdefinierte Anweisung zur Überprüfung der aktuellen Anwendungsumgebung zu definieren, können Sie dies in der AppServiceProvider-Methode von boot tun: 

use Illuminate\Support\Facades\Blade;
/**
 * 执行注册后引导服务
 *
 * @return void
 */
 public function boot(){  
   Blade::if('env', function ($environment) {     
   return app()->environment($environment);   
   });
 }

Sobald die benutzerdefinierte bedingte Anweisung definiert ist, können Sie sie einfach hinzufügen in der Vorlage Verwendung: 

@env('local')    
  // 应用在本地环境中运行...
@elseenv('testing')    
  // 应用在测试环境中运行...
@else    
  // 应用没有在本地和测试环境中运行...
@endenv
Dieser Artikel erschien zuerst auf der Website LearnKu.com.
→