[笔记]关于blade布局的使用
1 / 0 / 创建于 3年前 /
李先生 的个人博客
一.需求描述
在开发过程中，一般将css文件引用放在head中，js文件的引用放在底部，而书写的js代码放在js文件引用的最下面。
有时候不同的页面会引用一些其他的js文件或css文件，若在布局中全部引入又有些不合理。
二.布局使用
主要使用布局的@section(‘xxx’)，@stop @append @show
1.layout.blade.php，一个简单的布局文件
<!DOCTYPE html>
<html>
@include('public.header')
<body>
@yield('content')
@include('public.footer')
</body>
</html>2.header.blade.php，公共头部
<head>
<meta charset="utf-8">
<title>B5LaravelCMF</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link href="通用css" rel="stylesheet"/>
@section('css_common')
@show
<link href="通用css" rel="stylesheet">
</head>在头部文件引用了通用的css，而页面如果引用其他css文件则放在@section(‘css_common’)的位置。
3.footer.blade.php，底部文件
<script src="通用js"></script>
@section('js_common')
@show
<script src="通用js"></script>
@section('script')
@show底部引用了通用js，而页面如果引用其他css文件则放在@section(‘js_common’)的位置。页面书写的js代码在@section(‘script’)位置
4.一个页面
@extends('public.layout')
@section('js_common')
<script src="其他js"></script>
@append
@section('css_common')
<link rel="stylesheet" href="其他css">
@append
@section('content')
页面内容
@stop
@section('script')
<script>
js代码
</script>
@stop5.总结
我们可以将每个插件的js和css引用放在一个单独文件中，如bootstrap插件
我们定义一个assets/bootstrap.blade.php
@section('css_common')
<link rel="stylesheet" href="bootstrap.min.css">
@append
@section('js_common')
<script src="bootstrap.min.js')}}"></script>
@append然后在页面中直接include
@extends('public.layout')
@include('assets.bootstrap')
@include('assets.XXXXX')
@section('content')
页面内容
@stop
@section('script')
<script>
js代码
</script>
@stop本作品采用《CC 协议》，转载必须注明作者和本文链接
关于 LearnKu
粤公网安备 44030502004330号