Laravel8でビューを作ってみます。
bladeを使用します。
resources/views がビューの配置場所です。
今回は resources/views/test ディレクトリを用意し、そこに index.blade.php を作成します。
ビューファイルは xxx.blade.php という名称にします。
中身は普通のhtmlを同じように記載できます。
コントローラから呼び出す際は以下のように views からの相対パスで指定します。
return view('test/index');
コントローラから渡された変数の参照などは {{ $test }} のようにして記載することができます。
例えば、title タグの内容に $test の内容を出力したいときは以下のように書きます。
<title>{{ $test }}</title>
a タグのリンク先などはそのまま書いてもいいですが、routes/web.php で定義した名前付きルートを名前で呼び出すこともできます。引数が定義されている場合は渡すこともできます。
<a href="{{ route('test.index') }}">test.indexで定義されたルートへのリンク</a>
<a href="{{ route('test.edit', ['id' => 3]) }}">引数が定義されている場合のリンク</a>
条件分岐やループももちろん使うことができます。
@ 記号を付けて記載します。if文であれば、@if(条件) ～ @endif となり、
ループであれば、@foreach(配列 as 要素) ～ @endforeach のように書くことができます。
<div>
@if($test > 0)
<p>変数 $test が0より大きい場合に表示される要素</p>
@endif
<ul>
@foreach($items as $item)
<li>{{ $item }}</li>
@endforeach
</ul>
</div>
途中でphpの処理を行いたい場合は @php ～ @endphp で処理を記載することもできます。
<div>
@php
$item = 'test';
@endphp
<p>{{ $item }}</p>
</div>
複数ページを作っていると共通部分をまとめたくなると思います。
例えば、共通部分を layout.blade.php として以下のように作成します。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="style.css" />
<title>タイトル</title>
</head>
<body>
@yield('content')
<script src="script.js"></script>
</body>
</html>
そして、index.blade.php など、共通部分を使用する側は以下のように書くことができます。
@extends('layout')
@section('content')
<div>
固有の内容を記載する
</div>
@endsection
これは @extends(‘layout’) で layout.blade.php を展開し、@yield(‘content’) の部分に埋め込みたい内容を @section(‘content’) ～ @endsection に記載するというものです。
ほかにも一部のパーツのみを form.blade.php など別のファイルに定義して参照したい場合は以下のように書くことができます。
@extends('layout')
@section('content')
<div>
別のファイルに定義したパーツを使用する
<div>
@include('form')
</div>
</div>
@endsection
読み込む blade に変数を渡したい場合は以下のように、2つめの引数で変数名と値の辞書を渡すこともできます。
@include('form', ['type' => 2])
これで簡単なビューなら作ることができるかと思います。