Blade布局是指具有多个公共部分的布局，可以在整个应用程序中使用，无需为此加载多个文件。公共区域包括页眉、页脚、侧边栏等。它包括Blade语法。
我们也使用相同的文件夹结构/resources/views来存储布局。让我们创建一个简单的基本Blade布局。在/resources/views/layouts/app.blade.php创建一个文件
app.blade.php
<html>
<head>
<title>App Name - @yield('title')</title>
</head>
<body>
@section('sidebar')
This is the common sidebar.
@show
<div class="container">
@yield('content')
</div>
</body>
</html>
现在，让我们看看如何使用内部应用程序。创建一个文件/resources/views/about-us.blade.php。在这个视图文件中，我们需要为动态占位符扩展和添加内容。
about-us.blade.php
@extends('layouts.app')
@section('title', 'About Us')
@section('sidebar')
@parent <!-- Includes parent sidebar -->
<p>About us page sidebar</p>
@stop
@section('content')
<p>This is about us content page.</p>
@stop
@extends('layouts.app') 从layouts文件夹扩展布局。
同样，我们可以创建多个应用程序视图，并根据页面放置页面内容。
在布局中包含部分文件
要包含部分文件或子视图，我们使用@include指令。该指令允许我们将子视图渲染到其他视图中。我们可以包含主Blade布局，也可以包含在任何视图文件中。
假设我们有一个名为slider.blade.php的滑块文件到/resources/views/partials/slider.blade.php文件中，该文件包含滑块的 HTML 代码。现在我们要包含到欢迎页面布局中。
关于-us.blade.php
@extends('layouts.app')
@section('title', 'About Us')
@section('sidebar')
@parent <!-- Includes parent sidebar -->
<p>About us page sidebar</p>
@stop
@section('content')
@include('partials.slider')
<p>This is about us content page.</p>
@stop
@include('partials.slider') 包括部分文件滑块partials 文件夹。
如何访问公共文件
所有公共可访问文件都应放在公共目录中。假设我们已经创建并存储了一些文件作为/public/assets/css/style.css和/public/assets/js/script.js。
有多种方法可以将公共资产文件附加到布局和查看文件。我们将使用其中之一作为URL::to()添加到布局中。这是来自使用 Illuminate\Support\Facades\URL Facade。
添加查看文件为 –
<link rel="stylesheet" type="text/css" href="{{ URL::to('assets/css/style.css') }}">
<script type="text/javascript" src="{{ URL::to('assets/js/script.js') }}"></script>
添加样式和 javascripts 以查看文件
我们正在使用@stack指令来放置诸如 javascript 和样式表文件之类的资产。这对于指定子视图和样式文件所需的任何 JavaScript 库特别有用。
layout blade文件
<html>
<head>
<title>App Name - @yield('title')</title>
@stack('styles')<!-- To include style links -->
</head>
<body>
@section('sidebar')
This is the common sidebar.
@show
<div class="container">
@yield('content')
</div>
@stack('scripts') <!-- To include script links -->
</body>
</html>
在任何视图文件中扩展布局。
任何视图文件可以使用
@extends('layouts.app')
@section('title', 'About Us')
@push('styles')
<link rel="stylesheet" href="/assets/css/style.css"/>
<style>
/* css code */
</style>
@endpush
@section('sidebar')
@parent <!-- Includes parent sidebar -->
<p>About us page sidebar</p>
@stop
@section('content')
@include('partials.slider')
<p>This is about us content page.</p>
@stop
@push('scripts')
<script src="/assets/js/script.js"></script>
<script>
// .. custom js code
</script>
@endpush
资源文件应该放在/public/assets/css和/public/assets/js文件夹中。
我们希望本文能帮助您以非常详细的方式了解 Laravel 8 布局和视图。
标签：laravel,文件,layout,section,视图,content,us,sidebar,模板 From： https://www.cnblogs.com/chenkg/p/17770106.html