🦏
$slotでコンテンツ部分のみ書き換える
作成日:
2022/02/13
1
$slotの概要
$slotでコンテンツの異なる箇所だけページ別に表示ができる。
他のheaderやfooterは共通パーツとして使用可能。
手順
views/layouts
guest.blade.phpで全体のソースをコピー
views/components
components/tests/app.blade.php
を作成し、貼り付け
※app
の部分は任意名
{{ $slot }}に注目
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>{{ config('app.name', 'Laravel') }}</title>
<!-- Fonts -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap">
<!-- Styles -->
<link rel="stylesheet" href="{{ asset('css/app.css') }}">
<!-- Scripts -->
<script src="{{ asset('js/app.js') }}" defer></script>
</head>
<body>
<div class="font-sans text-gray-900 antialiased">
{{ $slot }}
</div>
</body>
</html>
views/tests/
component-1.blade.php
<x-tests.app>
コンテンツ内容を書く
</x-tests.app>
{{ $slot }}に↑のコンテンツ内容を書く
が入ってくる。
事業会社にてコーダーをしています。制作は6年目。
インプットしたことをアウトプットしています。