はじめてLaravel6.0：ControllerクラスからViewのbladeテンプレートへの変数データ受け渡しサンプル

f:id:arakan_no_boku:20191003220222p:plain

サンプルの説明
サンプルソース
- resources\views\home.blade.php
- app\Http\Controllers\HomeController.php
サンプルソースの補足説明
実行イメージ

サンプルの説明

Laravel6.0のControllerクラスから、Viewのbladeテンプレートへの変数データの渡し方とBladeテンプレートでの各種情報の表示方法を軽く勉強してみます。

Controllerクラスの変数の値を、bladeテンプレートに渡す方法を確認します。

サンプルとしてやってみるのは。

ログイン中のユーザのIDと名前の表示
configフォルダの設定情報の表示
画像の配置と表示
Controllerクラスでセットした変数と配列の値をView側で表示

の４つです。

最初にソース

変更するののは以下の２つのソースです。

resources\views\home.blade.php
app\Http\Controllers\HomeController.php

どちらも「php artisan ui vue --auth」実行時に、ログイン成功時のデフォルト遷移先として自動生成されたソースです。

サンプルソース

resources\views\home.blade.php

@extends('layouts.app')

@section('content')
<div class="container">
    <div class="row">
        <div class="col-md-4">
          <img src="{{ asset('images\laravel.jpg') }}">
        </div>
        <div class="col-md-8">
          @auth
             <h2 class="m-2">ログイン中のユーザ名は{{ Auth::user()->name }}です</h2>
             <h2 class="m-2">ログイン中のユーザIDは{{ Auth::id() }}です</h2>
          @endauth
          <h2 class="m-2">今は{{ $today }}です。</h2>
          <h2 class="m-2">10日後は{{ $thatday }}です</h2>
          <h2 class="m-2">現在のタイムゾーンは{{ config('app.timezone') }}。</h2>
          <h2 class="m-2">ロケールは{{ config('app.locale') }}です。</h2>
          @foreach  ( $tests as $key => $data )
              <h2 class="m-2">{{ $key}} ==) {{ $data }}です。</h2>
          @endforeach
        </div>
    </div>
</div>
@endsection

コントローラクラスです。

app\Http\Controllers\HomeController.php

<?php 

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Carbon\Carbon;

class HomeController extends Controller
{
 
    public function __construct()
    {
        $this->middleware('auth');
    }


    public function index()
    {
        $today = Carbon::now();
        $thatday = Carbon::now()->addDay(10);
        $tests = [
            1 => 'リスト１',
            2 => 'リスト２',
            3 => 'リスト３',
            4 => 'リスト４'];
        return view('home', compact(
            'today',
            'thatday',
            'tests'
        ));
    }
}

サンプルソースの補足説明

middleware('auth')の利用

ログイン中のユーザ名とIDを表示しています。

View側（home.blade.php）の以下の2か所です。

{{ Auth::user()->name }}
{{ Auth::id() }}

これで、ログインユーザ情報が取得するために、コントローラクラスのコンストラクタで、準備をしています。

$this->middleware('auth');

これをコンストラクタで宣言しておくことで、コントローラクラスの中でも「Auth::」の様々な機能が使えるようになります。

同様に、Bladeテンプレート内でも参照できるということです。

laravel.com

configフォルダの設定情報の表示

configフォルダ内で設定している情報の取得と表示もしています。

これに該当するのは以下の２つです。

{{ config('app.timezone') }}
{{ config('app.locale') }}

これは、configフォルダの「app.php」の中の「timezone」や「locale」に設定されている値を表示しています。

これはコントローラクラスで準備をする必要はありません。

画像の配置と表示

静的画像の表示もやってます。

これに該当するのは以下の部分です。

<img src="{{ asset('images\laravel.jpg') }}">

この「asset」というのは、「public」フォルダのパスを補完します。

自分は、publicフォルダに「images」というフォルダを作って、そこに「laravel.jpg」ファイルを置いていて、まさしく、それ（＝「・・・\public\images\laravel.jpg」）を表示してます。

CSSとかJSとかの静的リソースへのアクセス方法も同じです。

Controllerクラスの変数と配列の値をBladeに渡す

さて。

ここからが今回の本題です。

COntrollerクラスの変数の値をどうやってView（Bladeテンプレート）に渡すのかです。

Controllerの変数を、Blade内で表示している部分は以下の2か所です。

{{ $today }}
{{ $thatday }}

Controller内の配列の値を処理しているのは、以下の@foreachの部分です。

@foreach ( $tests as $key => $data )
<h2 class="m-2">{{ $key}} ==) {{ $data }}です。</h2>
@endforeach

ここで参照している「$today」「$thatday」「$tests」の３つの変数（配列含む）の値は、いずれもコントローラクラスでセットしています。

以下の部分ですね。

$today = Carbon::now();
$thatday = Carbon::now()->addDay(10);
$tests = [
1 => 'リスト１',
2 => 'リスト２',
3 => 'リスト３',
4 => 'リスト４'];

$todayには「今の日付時刻」。

$thatdayには「今から10日後の日付時刻」

を設定しています。

ちなみに。

日付の取得と計算には、CarbonというLaravelに同梱されている「日付時刻処理ライブラリ」を使ってます。

carbon.nesbot.com

上記は本家の英語サイトですが、CarbonはPHPのDateTimeの拡張版的位置づけで超有名なので、検索すれば、いくらでも日本語の使用例がでてきます。

Controllerクラス内で宣言し、値をセットした変数。

これらの変数をView（Bladeテンプレート）に渡しているのは、以下の部分です。

return view('home', compact(
'today',
'thatday',
'tests'
));

第二引数で変数の名称（$をとった部分）を、「compact」にくるんで渡してます。

compactは「各引数について名前を有する変数を探し、変数名がキー、変数の値がそのキーに関する値となるように追加した配列」を返すPHPの関数です。

つまり。

こういう書き方をスマートに書いているだけ・・ということです。

return view('home', [
'today' => $today,
'thatday' => $thatday,
'tests' => $tests
]);

この書き方でも正しくViewに値が渡されて、正しく表示されます。

でも、スマートに書けるのに、わざわざタイピング数を増やす必要はないよね・・ということですね。

同様のことが、with()を使うもう一つの方法にもいえます。

こんな風にも書けるわけです。

return view('home')->with([
'today' => $today,
'thatday' => $thatday,
'tests' => $tests
]);

これでも正しく表示されます。

でも、このWith()のケースをよく見ると、上記の配列をさらに「with()」で囲んでいる感じです。

さらに、キーボードのタイプ数だけが増えてますよね。

なので・・。

同じことができるなら「compact」で渡すやり方でいいじゃないかというだけです。

実行イメージ

まず、/registerにアクセスして、ユーザ登録画面を表示して、右上のログインリンクから、ログイン画面に遷移して、ユーザとパスワードでログインします。

そうすると「home」がこんな感じになりました。

f:id:arakan_no_boku:20191009233706p:plain

まあ、ほぼ意味のないでたらめ画面ですが（笑）。

ちゃんと変数の値の受け渡しやAuth情報の表示などができている。

それが確認できたのでOKです。

今回はこんなところで。

ではでは。

SE_BOKUのまとめノート的ブログ

SE_BOKUが知ってること・勉強したこと・考えたことetc