【PHP】Laravel开发——六、基础布局

最新推荐文章于 2025-07-10 09:33:19 发布

原创

最新推荐文章于 2025-07-10 09:33:19 发布 · 674 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#PHP #Laravel

本文介绍了如何在 Laravel 中构建基础页面布局，包括主要布局文件`app.blade.php`、顶部导航`_header.blade.php`和底部导航`_footer.blade.php`的创建。详细讲解了首页展示的实现过程，如创建控制器、视图、绑定路由以及使用 Laravel Mix 处理前端资源。此外，还提到了 Git 代码版本控制和项目开发总结。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

基础布局

我们先为项目构建一个基础的页面布局，布局文件统一放在resources/views/layouts文件夹中，布局涉及文件如下：

app.blade.php —— 主要布局文件，项目的所有页面都将继承于此页面，父页面；
_header.blade.php —— 布局的头部区域文件，负责顶部导航栏区块；
_footer.blade.php —— 布局的尾部区域文件，负责底部导航区块；

主要布局文件

我们先创建主要布局文件：resources/views/layouts/app.blade.php:

$ mkdir -p resources/views/layouts/
$ touch resources/views/layouts/app.blade.php

resources/views/layouts/app.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">  
<!-- CSRF Token -->  
<meta name="csrf-token" content="{
    
    { csrf_token() }}">  
<title>@yield('title', 'Laravel Shop') - Laravel 电商教程</title>  
<!-- 样式 -->  
<link href="{
    
    { mix('css/app.css') }}" rel="stylesheet">  
</head>  
<body>  
<div id="app" class="{
    
    { route_class() }}-page">  
@include('layouts._header')  
<div class="container">  
@yield('content')  
</div>  
@include('layouts._footer')  
</div>  
<!-- JS 脚本 -->  
<script src="{
    
    { mix('js/app.js') }}">