基本 - ビュー（Views） - 《Laravel 11.x ドキュメント》日本語

はじめに
- React / Vueでのビューの作成
ビューの作成とレンダリング
ビューへのデータの渡し方
- すべてのビューとデータを共有する
ビューコンポーザー
- 複数のビューにコンポーザーを添付する
ビュークリエーター
ビューの最適化

はじめに

もちろん、ルートやコントローラーから直接HTMLドキュメントの文字列を返すのは実用的ではありません。幸いなことに、ビューはすべてのHTMLを別のファイルに配置する便利な方法を提供します。

ビューは、コントローラー/アプリケーションロジックをプレゼンテーションロジックから分離し、resources/viewsディレクトリに保存されます。Laravelを使用する場合、ビューのテンプレートは通常、Bladeテンプレート言語を使用して記述されます。シンプルなビューは次のようになります:

<!-- View stored in resources/views/greeting.blade.php -->
<html>
   <body>
   <h1>Hello, {{ $name }}</h1>
   </body>
</html>

このビューはresources/views/greeting.blade.phpに保存されているため、グローバルviewヘルパーを使用して次のように返すことができます:

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

Bladeテンプレートの書き方についての詳細を探していますか？完全なBladeドキュメントをチェックして始めてください。

React / Vueでのビューの作成

多くの開発者は、Bladeを介してPHPでフロントエンドテンプレートを書くのではなく、ReactやVueを使用してテンプレートを書くことを好むようになりました。Laravelは、Inertiaというライブラリのおかげで、React / VueフロントエンドをLaravelバックエンドに簡単に結びつけることができ、SPAを構築する際の典型的な複雑さを回避できます。

私たちのBreezeとJetstreamのスターターキットは、Inertiaを利用した次のLaravelアプリケーションの素晴らしい出発点を提供します。さらに、Laravel Bootcampは、Inertiaを利用したLaravelアプリケーションの構築の完全なデモを提供し、VueとReactの例を含んでいます。

ビューの作成とレンダリング

.blade.php拡張子のファイルをアプリケーションのresources/viewsディレクトリに配置するか、make:view Artisanコマンドを使用してビューを作成できます:

php artisan make:view greeting


ビューを作成したら、グローバル`````view`````ヘルパーを使用してアプリケーションのルートまたはコントローラーの1つから返すことができます:  
``````php
Route::get('/', function () {
   return view('greeting', ['name' => 'James']);
});
`

ビューはViewファサードを使用しても返すことができます:

use Illuminate\Support\Facades\View;
return View::make('greeting', ['name' => 'James']);

ご覧のとおり、viewヘルパーに渡される最初の引数は、resources/viewsディレクトリ内のビューファイルの名前に対応します。2番目の引数は、ビューに利用可能にする必要があるデータの配列です。この場合、name変数を渡しており、これはBlade構文を使用してビュー内に表示されます。

ネストされたビューのディレクトリ

ビューはresources/viewsディレクトリのサブディレクトリ内にもネストできます。「ドット」表記を使用してネストされたビューを参照できます。たとえば、ビューがresources/views/admin/profile.blade.phpに保存されている場合、次のようにアプリケーションのルート/コントローラーの1つから返すことができます:

return view('admin.profile', $data);

ビューのディレクトリ名には.文字を含めるべきではありません。

最初の利用可能なビューの作成


``````php
use Illuminate\Support\Facades\View;
return View::first(['custom.admin', 'admin'], $data);
`

ビューが存在するかどうかの確認

ビューが存在するかどうかを確認する必要がある場合は、Viewファサードを使用できます。existsメソッドは、ビューが存在する場合trueを返します:

use Illuminate\Support\Facades\View;
if (View::exists('admin.profile')) {
   // ...
}

ビューへのデータの渡し方

前の例で見たように、ビューにデータの配列を渡して、そのデータをビューで利用可能にすることができます:

return view('greetings', ['name' => 'Victoria']);

この方法で情報を渡す場合、データはキー/値ペアの配列である必要があります。ビューにデータを提供した後、<?php echo $name; ?>のようにデータのキーを使用して、ビュー内の各値にアクセスできます。


``````php
return view('greeting')
   ->with('name', 'Victoria')
   ->with('occupation', 'Astronaut');
`

すべてのビューとデータを共有する

時折、アプリケーションによってレンダリングされるすべてのビューとデータを共有する必要があります。Viewファサードのshareメソッドを使用してこれを行うことができます。通常、shareメソッドへの呼び出しは、サービスプロバイダーのbootメソッド内に配置するべきです。App\Providers\AppServiceProviderクラスに追加するか、別のサービスプロバイダーを生成してそれらを格納することができます:

<?php
namespace App\Providers;
use Illuminate\Support\Facades\View;
class AppServiceProvider extends ServiceProvider
{
   /**
     * Register any application services.
   */
   public function register(): void
   {
   // ...
   }
   /**
     * Bootstrap any application services.
   */
   public function boot(): void
   {
   View::share('key', 'value');
   }
}

ビューコンポーザー

ビューコンポーザーは、ビューがレンダリングされるときに呼び出されるコールバックまたはクラスメソッドです。ビューがレンダリングされるたびにそのビューにバインドしたいデータがある場合、ビューコンポーザーはそのロジックを単一の場所に整理するのに役立ちます。ビューコンポーザーは、アプリケーション内の複数のルートやコントローラーによって同じビューが返され、常に特定のデータが必要な場合に特に便利です。

通常、ビューコンポーザーはアプリケーションのサービスプロバイダーの1つ内で登録されます。この例では、App\Providers\AppServiceProviderがこのロジックを保持すると仮定します。


``````php
<?php
namespace App\Providers;
use App\View\Composers\ProfileComposer;
use Illuminate\Support\Facades;
use Illuminate\Support\ServiceProvider;
use Illuminate\View\View;
class AppServiceProvider extends ServiceProvider
{
   /**
     * Register any application services.
   */
   public function register(): void
   {
   // ...
   }
   /**
     * Bootstrap any application services.
   */
   public function boot(): void
   {
   // Using class based composers...
   Facades\View::composer('profile', ProfileComposer::class);
   // Using closure based composers...
   Facades\View::composer('welcome', function (View $view) {
   // ...
   });
   Facades\View::composer('dashboard', function (View $view) {
   // ...
   });
   }
}
`

コンポーザーを登録したので、App\View\Composers\ProfileComposerクラスのcomposeメソッドは、profileビューがレンダリングされるたびに実行されます。コンポーザークラスの例を見てみましょう:

<?php
namespace App\View\Composers;
use App\Repositories\UserRepository;
use Illuminate\View\View;
class ProfileComposer
{
   /**
     * Create a new profile composer.
   */
   public function __construct(
   protected UserRepository $users,
   ) {}
   /**
     * Bind data to the view.
   */
   public function compose(View $view): void
   {
   $view->with('count', $this->users->count());
   }
}

ご覧のとおり、すべてのビューコンポーザーはサービスコンテナを介して解決されるため、コンポーザーのコンストラクタ内で必要な依存関係をタイプヒントすることができます。

複数のビューにコンポーザーを添付する


``````php
use App\Views\Composers\MultiComposer;
use Illuminate\Support\Facades\View;
View::composer(
   ['profile', 'dashboard'],
   MultiComposer::class
);
`


``````php
use Illuminate\Support\Facades;
use Illuminate\View\View;
Facades\View::composer('*', function (View $view) {
   // ...
});
`

ビュークリエーター

ビュー「クリエーター」はビューコンポーザーに非常に似ていますが、ビューがインスタンス化された直後に実行され、ビューがレンダリングされるのを待ちません。ビュークリエーターを登録するには、creatorメソッドを使用します:

use App\View\Creators\ProfileCreator;
use Illuminate\Support\Facades\View;
View::creator('profile', ProfileCreator::class);

ビューの最適化

デフォルトでは、Bladeテンプレートビューはオンデマンドでコンパイルされます。ビューをレンダリングするリクエストが実行されると、Laravelはコンパイルされたバージョンのビューが存在するかどうかを判断します。ファイルが存在する場合、Laravelは未コンパイルのビューがコンパイルされたビューよりも最近変更されているかどうかを判断します。コンパイルされたビューが存在しないか、未コンパイルのビューが変更されている場合、Laravelはビューを再コンパイルします。

リクエスト中にビューをコンパイルすると、パフォーマンスにわずかな悪影響を与える可能性があるため、Laravelはアプリケーションで使用されるすべてのビューを事前にコンパイルするためのview:cache Artisanコマンドを提供します。パフォーマンスを向上させるために、このコマンドをデプロイプロセスの一部として実行することをお勧めします:

php artisan view:cache

ビューキャッシュをクリアするには、view:clearコマンドを使用できます:

php artisan view:clear