ブレードテンプレート


ブレード テンプレート

Blade は、Laravel が提供するシンプルかつ強力なテンプレート エンジンです。他の一般的な PHP テンプレート エンジンとは異なり、Blade はビューでのネイティブ PHP コードの使用を制限しません。すべての Blade ビュー ファイルはネイティブ PHP コードにコンパイルされてキャッシュされ、変更されない限り再コンパイルされません。つまり、Blade は基本的にアプリケーションに負担を与えません。ブレード ビュー ファイルは、ファイル拡張子として

.blade.php を使用し、resources/views

ディレクトリに保存されます。

#テンプレートの継承

レイアウトの定義

Blade の 2 つの主な利点は、テンプレートの継承と ブロックです。まず、簡単な例から始めましょう。まず、「メイン」ページのレイアウトを見てみましょう。ほとんどの Web アプリケーションは異なるページ間で同じレイアウトを使用するため、単一のブレード レイアウト ビューを簡単に定義できます。 

<!-- 保存在  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>

ご覧のとおり、このファイルには一般的な HTML 構文が含まれています。ただし、@section ディレクティブと @yield ディレクティブに注意してください。 @section ディレクティブはビューの一部を定義し、@yield ディレクティブは指定された部分のコンテンツを表示するために使用されます。

このアプリケーションのレイアウトを定義したので、このレイアウトを継承するサブページを定義します。

##拡張レイアウト

サブビューを定義するときは、Blade の

@extends ディレクティブを使用してビューを指定しますサブビューはそこから「継承」する必要があります。 Blade レイアウトを拡張するビューは、@section ディレクティブを使用してコンテンツをレイアウト セクションに挿入できます。前の例で示したように、これらのフラグメントのコンテンツは、@yield ディレクティブによって制御されるレイアウトに表示されます: 

<!-- 保存在 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

この例では、

sidebar Fragments @parent ディレクティブを使用して、レイアウトのサイドバーにコンテンツを (上書きではなく) 追加します。ビューがレンダリングされると、@parent ディレクティブはレイアウト内のコンテンツに置き換えられます。

{tip} 前の例とは異なり、ここでは

sidebar フラグメントが @show ではなく @endsection で終わります。 @endsection ディレクティブは 1 つのセクションのみを定義しますが、@show は定義中にすぐにこのセクションを生成します。

ブレード ビューは、グローバル
view

アシスタントを使用してルーティングから戻ることができます: 

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

コンポーネントとスロット

コンポーネントとスロットは、フラグメントとレイアウトと同様の利点を提供しますが、コンポーネントとスロットのメンタル モデルは理解しやすいです。まず、アプリケーションで再利用したい再利用可能な「アラート」コンポーネントを見てみましょう: 

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

{{ $slot }}

変数には、に注入する値が含まれます。コンポーネントの内容。ここで、Blade の @component ディレクティブを使用してこのコンポーネントを構築します。 

@component('alert') 
<strong>Whoops!</strong> Something went wrong!
@endcomponent
コンポーネントに対して複数のスロットを定義すると便利な場合があります。アラート コンポーネントを変更して、「タイトル」を挿入できるようにします。名前付きスロットは、対応する「echo」変数を介して表示できます。 

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

@slot

ディレクティブを使用して、名前付きスロットにコンテンツを挿入できるようになりました。 @slot ディレクティブ内にないコンテンツは、コンポーネントの $slot 変数に渡されます: 

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

追加データをコンポーネントに渡す

追加データをコンポーネントに渡すことが必要になる場合があります。この場合、含まれるデータは、@component ディレクティブの 2 番目のパラメーターとして配列に編成できます。すべてのデータは変更としてコンポーネント テンプレートに提供されます: 

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

コンポーネントのエイリアス

コンポーネントがサブディレクトリに保存されている場合は、次のように指定することもできます。これらは簡単にアクセスするためのエイリアスです。たとえば、Blade コンポーネントが resources/views/components/alert.blade.php に保存されている場合、component メソッドを使用して components.alert の別名は alert です。通常、このプロセスは AppServiceProvider の boot メソッドで実行されます: 

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

コンポーネントにエイリアスがあると、単一のディレクティブを使用してレンダリングできます。 

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

追加のスロットがない場合は、コンポーネント パラメータを省略することもできます: 

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

##Display data

ブレード ビューに渡されるデータは、二重中括弧で囲まれた変数を通じて表示できます。たとえば、ルート 

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

の場合、

name 変数を使用してその内容を表示できます: 

Hello, {{ $name }}.

{tip} Blade

{{ }} XSS 攻撃を防ぐために、ステートメントは PHP の htmlspecialchars 関数を自動的に通過します。

ビューに渡された変数の内容の表示に限定されず、任意の PHP 関数の結果を表示することもできます。実際、Blade の echo ステートメントには、任意の PHP コードを含めることができます。 

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

エスケープされていない文字を表示します

デフォルトでは、Blade The

{{ }} XSS 攻撃を防ぐために、 ステートメントは PHP の htmlspecialchars 関数を通じて自動的に渡されます。データをエスケープしたくない場合は、次の構文を使用できます。 

Hello, {!! $name !!}.

{note} ユーザーが指定したコンテンツをアプリケーションからエコーする場合は注意が必要です。ユーザーが指定したデータを表示する場合は、XSS 攻撃から保護するために、常に二重中括弧構文エスケープを使用する必要があります。

JSON のレンダリング

JavaScript 変数を初期化するために、データをビューに渡して JSON にレンダリングすることがあります:

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

ただし、

json_encode 関数を手動で呼び出す代わりに、@json Blade ディレクティブを使用できます。 

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

HTML エンティティ エンコーディング

デフォルトでは、Blade (および Laravel の

e ヘルパー) は HTML エンティティを二重エンコードします。二重エンコードを無効にしたい場合は、AppServiceProvider の boot で Blade::withoutDoubleEncoding メソッドを呼び出すことができます: 

<?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 フレームワーク

多くの JavaScript フレームワークでも中括弧を使用して、特定の式がブラウザーに表示されることを示すため、@ 記号を使用して Blade に通知できます。特定のレンダリング エンジンの表現は変更されないはずです。例は次のとおりです: 

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

この例では、@ シンボルが Blade によって削除されます。Blade エンジンでは、{{ name }} 式が削除されます。代わりに、JavaScript エンジンが式をレンダリングします。

@verbatim コマンド

大きなテンプレートで JavaScript 変数を使用する場合は、HTML を @verbatim で囲むことができます。 ディレクティブなので、各 Blade echo ステートメントに @ 記号を追加する必要はありません: 

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

## 制御構造

テンプレートの継承とデータ表示に加えて、Blade は分岐やループなどの PHP 制御構造の便利なショートカットも提供します。これらのショートカットは、PHP の対応するものとの類似性を維持しながら、PHP 制御構造を操作するクリーンで簡単な方法を提供します。

If ステートメント

では

@if

、@elseif## を使用できます。 #、@else、および @endif ディレクティブは if ステートメントを構築します。これらのディレクティブは、対応する PHP ディレクティブと同じように機能します: 

@if (count($records) === 1)  
  I have one record!
@elseif (count($records) > 1)   
   I have multiple records!
@else  
    I don't have any records!
 @endif
便宜上、Blade は @unless

ディレクティブも提供します: 

@unless (Auth::check())
    You are not signed in.@endunless
すでに説明した条件付きディレクティブに加えて、 @isset

および

@empty ディレクティブは、対応する PHP 関数へのショートカットとして使用できます: 

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

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

認証ディレクティブ

@auth

ディレクティブと

@guest ディレクティブを使用すると、現在のユーザーが認証されているかゲストであるかをすばやく判断できます。必要に応じて 

@auth    // 此用户身份已验证...@endauth
@guest    // 此用户身份未验证...@endguest
を使用できます@auth

および

@guest ディレクティブは、検証する必要がある ID を指定します: 

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

フラグメント ディレクティブ
を使用できます

@hasSection

コマンドは、セクションにコンテンツがあるかどうかを確認します。 

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

#Switch コマンド

を使用できます。
@switch

、

@case

、@break、@default、および @endswitch 命令は switch ステートメントを構成します。 

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

ループ

分岐ステートメントに加えて、Blade は PHP のループ構造と同じ簡略化された命令も提供します。これらの命令の機能は、対応する PHP 命令と同じです。 

@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} ループ内で loop 変数 を使用して、ループの評価可能な情報を取得できます。 、現在ループ内にあるかなど 最初の反復または最後の反復:

ループ内では、ループを終了したり、この反復を通過したりすることもできます: 

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

条件を 1 行で宣言することもできます。 命令: 

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

ループ変数

ループ中に、ループ本体のloop変数で使用可能な$。この変数は、現在のループのインデックスや、それが最初のループであるか最後のループであるかなど、少量の有用な情報へのアクセスを提供します。 

@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

ネストされたループでは、parent を使用できます。プロパティは、親ループの $loop 変数にアクセスします: 

@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 この変数には、他のいくつかの便利なプロパティも含まれています:

インデックス現在の反復 (0 から数えます)。 現在のループ反復 (1 から数えます)。 ループ内の残りの反復回数。 反復される配列要素の合計数。 は、ループの最初の反復です。 は、ループの最後の反復です。 現在の反復のネストの深さレベル。 ネストされたループでは、親ループのループ変数

注釈

Blade では、ビュー内で注釈を定義することもできます。ただし、HTML コメントとは異なり、Blade コメントはアプリケーションに返される HTML には含まれません。 #場合によっては、ビューに PHP コードを埋め込むと便利です。テンプレートで

@php

ディレクティブを使用して、ネイティブ PHP コード ブロックを実行できます: 

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

{tip} Blade はこの機能を提供しますが、頻繁に使用されることは、この機能が埋め込まれていることを意味します。テンプレート、ロジックが多すぎます。 ＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃形状＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃＃ ＃＃ CSRF フィールド
アプリケーションで HTML フォームが定義されている限り、CSRF 保護ミドルウェアがリクエストを検証できるように、非表示の CSRF トークン フィールドをフォームに含める必要があります。 Blade の

@csrf

コマンドを使用して、トークン フィールドを生成できます: 

@php    //@endphp

#メソッド フィールド

HTML フォームは、PUT、

PATCH
、
DELETE

リクエストを発行できないため、これらの HTTP 動詞を模倣する非表示の

_method

フィールドを追加する必要があります。 Blade の @method コマンドは、このドメインの作成に役立ちます: 

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

サブビューの導入

Blade の @include ディレクティブを使用すると、他のビューから Blade ビューをインポートできます。親ビューで使用可能なすべての変数は、導入されたビューでも使用できます: 

<form action="/foo/bar" method="POST">
    @method('PUT')    
    ...
</form>
組み込みビューは、親ビューから使用可能なすべてのデータを継承するだけでなく、フォーム内の組み込みビューに追加データを渡すこともできます。データ: 
<div>
    @include('shared.errors')   
   <form>       
    <!-- Form Contents -->    
  </form>
</div>

存在しないビューが

@include

に渡されると、Laravel はエラーをスローします。存在を判断できないビューを含めるには、@includeIf ディレクティブを使用します。 

@include('view.name', ['some' => 'data'])
指定されたブール条件に依存するビューを含めるには、@ includeWhen を使用します。ディレクティブ: 
@includeIf('view.name', ['some' => 'data'])
指定されたビュー配列に最初の既存のビューを含めるには、includeFirst ディレクティブを使用します: 

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

{note } Blade ビューでは __DIR__

および
__FILE__
マジック定数を使用します。これらの定数は、キャッシュ内のコンパイルされたビューの場所を指すためです。

含まれるビューに別名を与える

Blade に含まれるビューがサブディレクトリに保存されている場合は、簡単にアクセスできる別名を与えることができます。たとえば、次のコンテンツを含むブレード ビュー コンテンツは、resources/views/includes/input.blade.php ファイルに保存されます: 

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

include## を使用できます。 # このメソッドは includes.input で、input というエイリアスが与えられます。通常、これは AppServiceProvider の boot メソッドで行われます。 

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

含まれるビューにエイリアスがあると、Blade と同じようにエイリアスを使用してレンダリングできます。ディレクティブ : 

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

コレクションのビューのレンダリング

Blade の

@each## を使用できます# ループの結合のコマンドは 1 行に含まれます: 

@input(['type' => 'email'])
最初のパラメーターは、配列またはコレクションの各要素をレンダリングするビュー フラグメントです。 2 番目のパラメーターは反復処理する配列またはコレクションで、3 番目のパラメーターはビュー内の現在の反復に割り当てられる変数の名前です。たとえば、

jobs

の配列を反復処理する場合、通常はビュー フラグメント内の job 変数を使用して各タスクにアクセスします。現在の反復のキーは、ビュー フラグメントの key 変数として使用されます。 4 番目のパラメータを

@each

ディレクティブに渡すこともできます。このパラメータは、指定された配列が空の場合にレンダリングするビュー フラグメントです。 

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

{note}
@each

レンダリングされたビューでは、親ビューから変数を継承できません。サブビューでこれらの変数が必要な場合は、代わりに @foreach と @include を使用する必要があります。

Stack

Blade では、ビューをスタックにプッシュできます。これらのビューは、他のビュー、またはレイアウトでレンダリングされます。これは、サブビューで必要な JavaScript ライブラリを指定するときに便利です。 

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

必要に応じてスタックに複数回プッシュできます。スタック コンテンツのレンダリングは、スタック名を

@stack

ディレクティブに渡すことによって完了します。 

@push('scripts')  
  <script src="/example.js">
  </script>
@endpush
スタックの一番上にコンテンツをプリセットしたい場合は、

@prepend

ディレクティブ : 

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

サービス インジェクション

@inject

ディレクティブはLaravelからのサービスに使用できます コンテナからサービスを取得します。 @inject に渡される最初のパラメータは挿入されるサービス変数の名前で、2 番目のパラメータは解決されることが期待されるクラスまたはインターフェイスの名前です: 

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

ブレードの拡張

ブレードでは、directive メソッドを使用してディレクティブをカスタマイズできます。 Blade コンパイラがカスタム ディレクティブを検出すると、ディレクティブに含まれる式によって提供されるコールバックが呼び出されます。

次の例では、指定された DateTime$var: をフォーマットするインスタンスである @datetime($var)

ディレクティブを作成します。 
@inject('metrics', 'App\Services\MetricsService')
<div>
    Monthly Revenue: {{ $metrics->monthlyRevenue() }}.</div>

ご覧のとおり、このディレクティブに渡される任意の式で format メソッドを連鎖させます。この例では、ディレクティブは次のネイティブ PHP コードを生成します: 

<?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()  
        { 
             //    
         }
      }

{note} Blade ディレクティブのロジックを更新した後は、Blade ビューのすべてのキャッシュが必要になります。 view:clear Artisan コマンドを使用して、ブレード ビュー キャッシュを削除できます。

#カスタム If ステートメント

単純なカスタム条件ステートメントを定義する場合は、独自の条件ステートメントを作成します。ディレクティブは必要な手順よりも複雑です。この場合、Blade は

Blade::if メソッドを提供します。これにより、クロージャを使用して条件付き命令をすばやく定義できます。たとえば、現在のアプリケーション環境を確認するカスタム命令を定義するには、AppServiceProvider の boot メソッドでこれを実行できます: 

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

Once カスタム条件付き命令が定義されている場合は、テンプレートで簡単に使用できます。 

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

この記事は、
→

PHP中国語ウェブサイト

ホームページホームページコースコース記事記事に質問に質問辞書辞書マニュアルマニュアルダウンロードダウンロード検索検索APPダウンロード APPダウンロード
プロパティ説明
##$loop->index
$loop->iteration
$loop->remaining
$loop->count
$loop->first
$loop->last
$loop->length
$loop->parent