您的位置：首页 > 其它

基于Blade模板的页面重构

2019-01-14 13:45 274 查看

当创建的几个视图包含着一些重复的代码时，为了不违反（Don’t repeat yourself）原则，需要对页面进行重构，来保证代码的灵活与整洁。

方法：

将多余的代码从视图中抽离出来，单独创建一个默认视图以存放通用的代码。

在Laravel框架中，视图文件默认存储在 resources/views 文件夹中。

若在该文件夹下存在2个页面–home.blade.php和about.blade.php。

代码如下：

#home.blade.php

<!DOCTYPE html>
<html>
<head>
<title>Home</title>
</head>
<body>
<h1>This is home</h1>
</body>
</html>

#about.blade.php

<!DOCTYPE html>
<html>
<head>
<title>About</title>
</head>
<body>
<h1>This is about</h1>
</body>
</html>

显然这两个页面的代码编写违反了DRY，观察可发现有很多重复代码，提取出并在当前的view文件夹下新建名为 default.blade.php 的文件：

#default.blade.php

<!DOCTYPE html>
<html>
<head>
<title>@yield('title', 'Test')</title>
</head>
<body>
@yield('content')
</body>
</html>

@yield(‘content’) 表示该占位区域将用于显示 content 区块的内容，而 content 区块的内容将由继承自 default 视图的子视图定义

@yield(‘title’, ‘Test’) 表示类似上一个，但引入第二个参数表示当指定变量的值为空时，将用 Test 来作为默认值

然后对原有的俩页面进行重构

#重构后的 home.blade.php

@extends('default')
@section('title', 'Home')

@section('content')
<h1>This is home</h1>
@stop

#重构后的 about.blade.php

@extends('default')
@section('title', 'About')

@section('content')
<h1>This is about</h1>
@stop

@extends(‘default’) 表通过传递参数来继承 default 的视图模板

使用 @section 和 @stop 代码来填充父视图的 content 区块，所有包含在 @section 和 @stop 中的代码都将被插入到父视图的 content 区块。

若再将default拆为几个部分（局部视图）时，记得得在default中再引入这些局部视图。用 @include(‘file’)实现之

如此，便实现了图的重构，符合DRY理念

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航