laravel5.1框架基础之Blade模板继承简单使用方法分析

本文实例讲述了laravel5.1框架基础之Blade模板继承简单使用方法。分享给大家供大家参考，具体如下：

模板继承什么用？ 自然是增强基础页面的复用，有利于页面文档的条理，也便于更改多处使用的内容，如页头、页脚

1.用法概要

  • @include('common.header') 包含子视图
  • @extends('article.common.base') 继承基础模板
  • @yield('content') 视图占位符
  • @section('content') @endsection继承模板后向视图占位符中填入内容
  • {{-- 注释 --}} Blade模板中注释的使用

2.具体使用

2.1 新建Article基础模板base.blade.php

直接使用Bootstrap4模板代码及CDN,新建视图基础模板
路径resources/views/article/common/base.blade.php

<!DOCTYPE html><html lang="en">
<head>
<title>Artilce|标题在此</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="x-ua-compatible" content="ie=edge">  <link rel="stylesheet" href="https://cdn.rawgit.com/twbs/bootstrap/v4-dev/dist/css/bootstrap.css" rel="external nofollow" rel="external nofollow" >
</head>
<body>
{{-- 包含页头 --}}
@include('article.common.header')
{{-- 继承后插入的内容 --}}
@yield('content')
{{-- 包含页脚 --}}
@include('article.common.footer')
<script src="http://ajax.useso.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://cdn.rawgit.com/twbs/bootstrap/v4-dev/dist/js/bootstrap.js"></script>
</body>
</html>

2.2. 建子视图文件 页头和页脚

页头文件  resources/views/article/common/header.blade.php

<nav class="navbar navbar-light bg-faded">
  <div class="container">
  <a class="navbar-brand" href="#" rel="external nofollow" rel="external nofollow" >Articles</a>
  <ul class="nav navbar-nav">
    <li class="nav-item active">
    <a class="nav-link" href="/article" rel="external nofollow" >首页 <span class="sr-only">(current)</span></a>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="#" rel="external nofollow" rel="external nofollow" >写文章</a>
    </li>
  </ul>
  <ul class="nav navbar-nav pull-right">
  <li class="nav-item">
    <a href="" class=" rel="external nofollow" rel="external nofollow" btn btn-primary-outline">登录</a>
  </li>
  <li class="nav-item">
    <a href="" class=" rel="external nofollow" rel="external nofollow" btn btn-success-outline">注册</a>
  </li>
  </ul>
</div>
</nav>

页脚文件 resources/views/article/common/footer.blade.php

<div class="footer"
    style="width: 100%;height: 300px;background-color: #00B388;padding-top: 50px;">
  <div class="container">
    <h1 style="color: #FFFFFF;font-size: 1.5em;">Articles</h1>
  </div>
</div>

2.3 即可继承模板，实现复用

新建主页文件在resources/views/article/index.blade.php

@extends('article.common.base')
@section('content')
  <div class="container" style="height: 500px;text-align: center;">
  <h1 style="position: absolute;left: 35%;top: 30%;">继承模板的主页搞定了！</h1>
   {{-- 这里是Blade注释 --}}
  </div>
@endsection

2.4 如何访问？

需要路由以及控制器配合，这里简单只用路由实现，详细内容请点击,以及接下来的其它文段

在app/Http/routes.php 路由注册文件写上如下代码

Route::get('/',function(){
  return view('article.index');
});

启动你的配置的laravel跑的服务器，比如我在目录地址下php artisan serve

浏览器输入 ： localhost:8000，即可看到效果图

3. 效果图

articles效果图|色彩 #00B388

X bootstrap4起始模板代码

bootstrap4文档

<!DOCTYPE html>
<html lang="en">
 <head>
  <!-- Required meta tags always come first -->
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta http-equiv="x-ua-compatible" content="ie=edge">
  <!-- Bootstrap CSS -->
  <link rel="stylesheet" href="https://cdn.rawgit.com/twbs/bootstrap/v4-dev/dist/css/bootstrap.css" rel="external nofollow" rel="external nofollow" >
 </head>
 <body>
  <h1>Hello, world!</h1>
  <!-- jQuery first, then Bootstrap JS. -->
  <script src="http://ajax.useso.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
  <script src="https://cdn.rawgit.com/twbs/bootstrap/v4-dev/dist/js/bootstrap.js"></script>
 </body>
</html>

更多关于Laravel相关内容感兴趣的读者可查看本站专题：《Laravel框架入门与进阶教程》、《php优秀开发框架总结》、《php面向对象程序设计入门教程》、《php+mysql数据库操作入门教程》及《php常见数据库操作技巧汇总》

希望本文所述对大家基于Laravel框架的PHP程序设计有所帮助。

赞 (0)

相关推荐

  • Laravel中的Blade模板引擎示例详解

    前言 本文主要给大家介绍了关于Laravel中Blade模板引擎的相关内容,分享出来供大家参考学习,话不多说了,来一起看看详细的介绍吧. Blade 模板引擎 Blade 是 laravel 提供的一个简单强大的模板引擎,它是把 Blade 视图编译成原生的 PHP 代码并缓存起来.缓存会在 Blade 视图改变时而改变,这意味着 Blade 并没有给你的应用添加编译的负担.Blade 视图文件使用 .blade.php 后缀,一般都存储在 resources/views 目录下. 模板继承 先

  • Laravel框架中Blade模板的用法示例

    简介 Blade它不像其他流行的 PHP 模板引擎那样限制你在视图中使用原生的 PHP 代码,事实上它就是把 Blade 视图编译成原生的 PHP 代码并缓存起来.缓存会在 Blade 视图改变时而改变,这意味着 Blade 并没有给你的应用添加编译的负担.Blade 视图文件使用 .blade.php 后缀,一般情况下都被存储在 resources/views 目录. 1. 继承.片段.占位.组件.插槽 1.1 继承 1.1.1 定义父模板 Laravel/resources/views/ba

  • 解决Laravel blade模板转义html标签的问题

    解决Laravel blade模板转义html标签的问题: 后台textarea提交到表里面的数据展现到前端页面时(在后台已使用nl2br()函数进行转换),直接显示如下: 很尴尬!!! 解决方法如下: {!! $res->content !!} 中间部分是需要输出到页面的内容 使用{{}}会自动使用php中的htmlspecialchars方法来转义成实体,然后输出 上面那种方法可以不转义输出 新手,马克一下... 以上这篇解决Laravel blade模板转义html标签的问题就是小编分享给

  • laravel 5 实现模板主题功能

    众所周知,laravel渲染模板是通过View::make()实现的,需要显式指定模板文件路径: 复制代码 代码如下: function index() {     return View::make('index.index'); } 既然这样,我们就可以自己实现模板主题功能,我们只需要将模板文件放到一个主题名称对应的目录里就行,比如默认主题为 default 的话,我们就这样写: 复制代码 代码如下: function index() {     return View::make('def

  • PHP的Laravel框架中使用AdminLTE模板来编写网站后台界面

    PHP的Laravel框架中使用AdminLTE模板来编写网站后台界面

    AdminLTE 是一个基于Bootstrap 3.x的免费高级管理控制面板主题,完全响应式管理,适合从小型移动设备到大型台式机很多的屏幕分辨率. AdminLTE的特点: 充分响应 可分类的仪表盘 18插件和3自定义插件 重量轻和快速 与大多数主流浏览器兼容 完全支持Glyphicons,Fontawesome和图标 我们使用的工具 Laravel AdminLTE 2.3.2 Bower Composer 下载一个全新的 Laravel 如果不太清楚可以去官方网站查看文档link 在此我们直

  • Laravel框架模板继承操作示例

    本文实例讲述了Laravel框架模板继承操作.分享给大家供大家参考,具体如下: 关于模板的继承的加载,因为我们经常会在头部引入很多样式啊等相关文件,所以我们不能在每一个页面都重新写入 laravel和ThinkPHP加载的类似,ThinkPHP3.2使用 <extend name="模板名字" /> 占位使用 <block name="menu"></block> laravel只不过使用英文不同 举例来说一个页面,我们要在头部引

  • Laravel框架中自定义模板指令总结

    介绍 最近在学习laravel,在Laravel框架中使用模板的一种方法就是通过控制器布局,通常我们在视图模板中编写复杂的逻辑,看上去显得很杂乱,那么使用自定义的模板Directives,可以简化你的视图逻辑,编写出更优雅的代码,Laravel Blade是一种将其特殊语法编译成PHP和HTML的模板引擎.其特殊语法指令,指令是加糖功能,在其后隐藏杂乱的代码.模板包含大量的内置指令,例如@foreach/@if/@section/@extends等等,内置的指令对于做一个简单的项目足以,但是当你

  • Laravel框架之blade模板新手入门教程及小技巧

    Laravel框架之blade模板新手入门教程及小技巧

    简介 Blade 是 Laravel 所提供的一个简单且强大的模板引擎.相较于其它知名的 PHP 模板引擎,Blade 并不会限制你必须得在视图中使用 PHP 代码.所有 Blade 视图都会被编译缓存成普通的 PHP 代码,一直到它们被更改为止.这代表 Blade 基本不会对你的应用程序生成负担. Blade 视图文件使用 .blade.php 做为扩展名,通常保存于 resources/views 文件夹内. 为什么要使用blade模板 容易理解,思路清晰 方便,直接可以在框架里使用,可以直

  • laravel 5 实现模板主题功能（续）

    在之前一篇文章中我介绍了通过定义Response宏的方式来实现动态改变模板文件路径以实现主题功能: laravel实现模板主题功能,但后来我发现这种方法有个弊端,在模板中使用@extends必须显式指定模板路径,这可能造成混乱,我决定还是改变思想,主题和主题之间应该是完全隔离的,不存在就是不存在,不要自动去另外的主题中寻找替代的模板. 而原来定义response宏的方式可以实现,但我决定使用更加规范的方法. laravel的View类里有一个方法 View::addNamespace ,这个方法

  • Laravel框架模板加载,分配变量及简单路由功能示例

    本文实例讲述了Laravel框架模板加载,分配变量及简单路由功能.分享给大家供大家参考,具体如下: 作为世界上第一的PHP框架,学习Laraver势在必行,虽然国内盛行ThinkPHP,但是多会一个框架总是对自己有好处的. 通过前面的文章Laravel框架在本地虚拟机快速安装的方法,我们已经可以顺利安装Laravel 安装之后,在目录laravel\app\Http下,有一个routes.php文件,重点了,这个就是控制全站的路由文件. Route::get('/', function () {

  • laravel框架模板之公共模板、继承、包含实现方法分析

    本文实例讲述了laravel框架模板之公共模板.继承.包含实现方法.分享给大家供大家参考,具体如下: 简介: 利用laravel框架开发后台管理系统或web站点,即嵌入式开发,所以php开发人员要自己整合模板. 本篇举例后台管理系统 模板路径:/resources/views/admin 1.建立公共目录 /resources/views/admin/layouts/ layouts下面分别建立如下几个模板(可自行减少或增多) /header.blade.php  头部 /main.blade.

随机推荐