版权声明:原创文章,未经博主同意,不得擅自转载! https://blog.csdn.net/qq_36718999/article/details/82391587
1.@each 与 $loop
{{--$loop 中包含一些属性 --}}
{{-- @each(entity in entities)
<small>
{{$loop.index + 1}}.
first: <i>{{$loop.first}}</i>
last: <i>{{$loop.last}}</i>
total: <i>{{$loop.total}}</i>
odd: <i>{{$loop.isOdd}}</i>
even: <i>{{$loop.isEven}}</i>
</small>
{{entity.title}}:{{entity.content}}
@endeach --}}
2.@layout 引用模板布局
{{--@layout 引用模板布局 --}}
@layout('layouts.main')
@section('header')
@super
<h1>{{pageTitle || 'untitle'}}</h1>
@endsection
@section('content')
{{--会 覆盖 默认section中的内容 可以用@super保留默认内容 --}}
@each(entity in entities)
<small>
{{$loop.index + 1}}.
first: <i>{{$loop.first}}</i>
last: <i>{{$loop.last}}</i>
total: <i>{{$loop.total}}</i>
odd: <i>{{$loop.isOdd}}</i>
even: <i>{{$loop.isEven}}</i>
</small>
{{entity.title}}:{{entity.content}}
@endeach
@endsection
3.@include 引入局部布局
//footer.edge
<div class="footer">
<hr style="border:none;border-bottom:1px solid #eee">
<small>©xiaoyang</small>
</div>
//main.edge
@include('partials.footer')
4.@component 引用组件并传值
//index.edge
{{--会 覆盖 默认section中的内容 可以用@super保留默认内容 --}}
{{--@component @endcomponent 与 @!component 自封闭 引入组件 并传递数据--}}
@!component('components.list',{entities:entities,border:true,borderColor:'#ccc'})
//list.edge
@each(entity in entities)
<div class="" style="padding:4px;
@if(!$loop.last && border)
border-bottom: 1px solid {{borderColor || '#eee'}}
@endif
">
{{--如果不是最后一个 并且 border为true 添加底边线 --}}
<small>
{{$loop.index + 1}}.
first: <i>{{$loop.first}}</i>
last: <i>{{$loop.last}}</i>
total: <i>{{$loop.total}}</i>
odd: <i>{{$loop.isOdd}}</i>
even: <i>{{$loop.isEven}}</i>
</small>
{{entity.title}}:{{entity.content}}
</div>
@endeach
5. @slot , @yield
//compontent/list.edge
@yield($slot.notes)
{{-- 设置slot 的默认内容 --}}
<small>Put some notes here.</small>
@endyield
//index.edge
@section('content')
{{--会 覆盖 默认section中的内容 可以用@super保留默认内容 --}}
{{--@component @endcomponent 与 @!component 自封闭 引入组件 并传递数据--}}
@component('components.list',{entities:entities,border:true,borderColor:'#ccc'})
@slot('notes')
<small>Eat some fruites</small>
@endslot
@endcomponent
@endsection
6. 请求相关信息
<div class="">
{{--request.originalUrl 包含 查询参数 --}}
<small>URL:</small>{{request.url()}} <br>
<small>OriginalURL:</small>{{request.originalUrl()}} <br>
<small>Method:</small>{{request.method()}} <br>
<small>Protocol:</small>{{request.protocol()}} <br>
</div>
7. css 、js、img 资源链接
//public/css/mian.css
//public/js/mian.js
//public/splash.png
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>{{pageTitle || 'xiaoyang'}}</title>
{{--css js img 公共资源 都放在 public 下 --}}
{{css('css/mian')}}
{{script('js/mian')}}
</head>
<body style="background:url({{assetsUrl('splash.png')}})">