Bladeの使い方を理解しよう

本記事では、LaravelのBladeの使い方を解説致します。

コントローラについて詳しく理解できていない方は下記記事を参考にしてください。

https://laravel-times.com/index.php/2021/04/29/controller/

1 Bladeとは

Bladeとは

Bladeとは、Laravelでビューを作成するために用意されたテンプレートエンジンです。

簡単に言えば、見た目を作る絵助けをしてくれる機能です。

Bladeにはレイアウトで表示を制御したり、レイアウトを継承して複数の組み合わせをするための構文が用意されています。

値の表示

Bladeには様々な機能が用意されており、それらを実装するための構文もそろっています。基本的な構文の使い方を解説していきます。まずは値を埋め込む{{}}からです。

{{ 値・変数・式・関数・メソッドなど }}

1	{{ 値・変数・式・関数・メソッドなど }}

このように{{と}}の間に何かを書くことで、その文が返す値をその場に書き出します。

こちらの出力はHTMLエスケープ処理されます。HTMLタグなどをテキストとして設定した場合も、すべてエスケープ処理されるため、HTMLのタグとしては機能しません。

もしエスケープ処理されていなかった場合は、下記のように記述してください。

{!! 値・変数・式・関数・メソッドなど !!}

1	{!! 値・変数・式・関数・メソッドなど !!}

{!!と!!}の間に値を設定いたします。これで、値はエスケープ処理されなくなり、HTMLタグなどはそのままタグとして機能します。

@ifディレクティブ

Bladeにはディレクティブという機能があります。条件分岐に相当するディレクティブから解説してきます。

trueの時に表示をする

@if (条件)
・・・出力内容・・・
@endif

@if (条件)

・・・出力内容・・・

@endif

条件によって異なる表示をする

@if (条件)
・・・出力内容・・・
@else
・・・出力内容・・・
@endif

@if (条件)

・・・出力内容・・・

@else

・・・出力内容・・・

@endif

さらに複数の条件を表示する

@if (条件)
・・・出力内容・・・
@elseif (条件)
・・・出力内容・・・
@else
・・・出力内容・・・
@endif

@if (条件)

・・・出力内容・・・

@elseif (条件)

・・・出力内容・・・

@else

・・・出力内容・・・

@endif

ディレクティブは「＠ディレクティブ名」という形で記述しましょう。

実際に使用してみる

では実際にこちらをビュー側に記述しましょう。

<body>
    <h1>Blade/Index</h1>
    @if ($msg != '')
    <p>ようこそ!!{{$msg}}</p>
    @else
    <p>適当に何か記述してください。</p>
    @endif
    <from method="POST" action="/laravel">
        {{ csrf_field }}
        <input type = "text" name="msg">
        <input type = "submit">
    </form>
</body>

<body>

<h1>Blade/Index</h1>

@if ($msg != '')

@else

<p>適当に何か記述してください。</p>

@endif

</form>

</body>

ここでは、@ifを利用してtrueなら「ようこそ!!!○○」、falseなら「適当に記述してください。」と表示できるように設定しました。

次はLaravelControllerクラスを以下のように記述しましょう。

class LaravelController extends Controller
{
    public function index()
    {
        return view('laravel.index',['msg'=>'']);
    }
    public function post(Request $request)
    {
        return view('laravel.index',['msg'=>request->msg]);
    }
}