首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

3分钟短文:Laravel模板重用,构造你的页面布局

引言

编写代码的时候,我们总是追求写的最少,做的最多。能重用的就要重用,避免后期更改一处修改,处处修改的困境。而对于模板文件内的HTML内容,也完全可以如此构造。

本期就来说说模板的页面布局。

单区块布局

很显然,我们不想每写一个页面,都要把logo,导航栏,尾部声明都重新写一遍,那样页面多了起来之后,改一次头部文件,或者更换logo,或者修改网站的声明,都要把所有页面重新修改一次。

维护起来简直是灾难!

所以laravel blade模板提供了 layout 布局。在目录resources/views/layouts/内添加blade模板文件即可。

比如我们创建一个app.blade.php布局文件,并输入以下内容:

     Welcome to Laravel

    @yield('content')

其中,指令用于区分当前模板内的section块的名称。我们现在开始使用这个布局。修改上一章我们测试的页面模板文件:

@extends('layouts.app')

@section('content')

 LaravelHelpsYouBuildStuffFaster.

 Learn,teach,hack,andmakefriendswithdevelopersinyourcity.

@endsection

其中,指令表名使用的布局文件,就是我们上面创建的文件。其中,部分,指定了该区域块所要渲染的布局内的位置。

在浏览器打开根目录地址,正常路由到视图就可以看到输出页面了。

多区块布局

既然单个区块的布局可以正常渲染,毫无疑问,多区块也没有问题。通常页面会有一个侧边栏sidebar,和主体部分。对于头部和尾部的内容,往往是全局的内容,而导航栏内可能就是动态变化的,根据用户权限进行选择性地展示。

我们把布局文件layouts/app.blade.php文件再增加一些内容:

 @yield('content')

 @section('advertisement')

     ScoresomeLaravelswaginourstore!

 @show

使用了指令,其实是一个快捷方式,等同于下面的书写方式:

@endsection

@yield('advertisement')

也就是关闭区块,并立即输出该块内容。上面的布局我们解决了一个场景问题,就是加入在侧边栏有一个广告位,不同的页面路由会追加不同的内容,在模板内我们可以使用指令,将内容追加到声明的区块内。

在模板文件内实现下面的代码:

@extends('layouts.app')

@section('content')

@endsection

@section('advertisement')

@parent

@endsection

大家注意,在区块包裹的区域内使用了指令,这会把其之后的内容,追加到区块内,而不是覆盖区块布局的内容。

写在最后

本文通过laravel模板布局的指令介绍,演示了单个和多个区块的用法,以及如何在模板内引用布局并渲染。特别是对于区块的覆写,还有追加,可以有效地降低代码冗余度,提升编程效能。

Happy coding :-)

我是@程序员小助手,专注编程知识,圈子动态的IT领域原创作者

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20200927A011NL00?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券