在laravel下關於blade模板的嘗試
Blade模板
關於模板繼承和分區段
@section和@yield的實驗
①關於@section...@show嘗試
測試1
1 {{--appV2test.blade.php--}} 2 <html> 3 <head> 4 <title>@yield('title')</title> 5 </head> 6 <body> 7 @section('content') 8 <p>這是appV2test的内容</p> 9 @show 10 </body> 11 </html>
1 {{--def.blade.php--}} 2 @extends('test.appV2test') 3 @section('title','測試頁') 4 @section('content') 5 <p>更改文本内容</p> 6 <p>我的新内容????</p> 7 @stop
實驗結果：
更改文本内容 我的新内容????
測試2
1 {{--def.blade.php--}} 2 @extends('test.appV2test') 3 @section('title','測試頁') 4 @section('content') 5 @parent {{--new addition--}} 6 <p>更改文本内容</p> 7 <p>我的新内容????</p> 8 @stop
實驗結果：
這是appV2test的内容 更改文本内容 我的新内容????
結論：被@section...@show包裹的内容在被繼承時，若不使用@parent的情況下不會被渲染進網頁里。
②關於@section...@stop嘗試
測試1
1 {{--appV2test.blade.php--}} 2 <html> 3 <head> 4 <title>@yield('title')</title> 5 </head> 6 <body> 7 @section('content') 8 <p>這是appV2test的内容</p> 9 @stop 10 </body> 11 </html>
1 {{--def.blade.php--}} 2 @extends('test.appV2test') 3 @section('title','測試頁') 4 @section('content') 5 <p>更改文本内容</p> 6 <p>我的新内容????</p> 7 @stop
實驗結果：
<!--空的--> <body> </body>
測試2
1 {{--def.blade.php--}} 2 @extends('test.appV2test') 3 @section('title','測試頁') 4 @section('content') 5 @parent {{--new addition--}} 6 <p>更改文本内容</p> 7 <p>我的新内容????</p> 8 @stop
實驗結果：
<!--空的--> <body> </body>
結論：被@section...@stop包裹的内容在被繼承時，不會被渲染進繼承頁里，即使使用@parent也是一樣。
③關於@yield嘗試
測試1
1 {{--appV2test.blade.php--}} 2 <html> 3 <head> 4 <title>@yield('title')</title> 5 </head> 6 <body> 7 @yield('content') 8 <p>這是appV2test的内容</p> 9 </body> 10 </html>
1 {{--def.blade.php--}} 2 @extends('test.appV2test') 3 @section('title', '測試頁') 4 @section('content') 5 <p>更改文本内容</p> 6 <p>我的新内容????</p> 7 @stop
實驗結果：
更改文本内容 我的新内容???? 這是appV2test的内容
測試2：
{{--appV2test.blade.php--}} <html> <head> <title>@yield('title')</title> </head> <body> @yield('content') <p>這是appV2test的内容</p> @show {{--new addition--}} </body> </html>
實驗結果：
更改文本内容 我的新内容???? 這是appV2test的内容
測試3：
{{--appV2test.blade.php--}} <html> <head> <title>@yield('title')</title> </head> <body> @yield('content') <p>這是appV2test的内容</p> @stop {{--new change--}} </body> </html>
實驗結果：
{{--出錯--}}
結論：被@yield（或@yield...@show包裹的内容，等價）包裹的内容，在渲染到@yield所在DOM節點的父節點時，會先渲染繼承頁面在該父節點下的内容，最後再將被繼承頁的内容填充進去。不存在@yield...@stop。
關於@append和@override嘗試
測試1：
1 {{--appV2test.blade.php--}} 2 <html> 3 <head> 4 <title>@yield('title')</title> 5 </head> 6 <body> 7 @yield('body') 8 <div> 9 @yield('content') 10 <p>直接被繼承内容1</p> 11 <p>直接被繼承内容2</p> 12 <p>直接被繼承内容3</p> 13 </div> 14 </body> 15 </html>
1 {{--def.blade.php--}} 2 @extends('test.appV2test') 3 @section('title', '測試頁') 4 @section('body') 5 @section('content') 6 <p>第一行</p> 7 @append 8 9 <p>繼承頁内容1</p> 10 11 @section('content') 12 <p>第二行</p> 13 @append 14 15 <p>繼承頁内容2</p> 16 17 @section('content') 18 <p>第三行</p> 19 @stop 20 21 <p>繼承頁内容3</p> 22 @stop
實驗結果：
繼承頁内容1 繼承頁内容2 繼承頁内容3 第一行 第二行 直接被繼承内容1 直接被繼承内容2 直接被繼承内容3
暫時性結論：
注意到，先是渲染了繼承頁原有的内容，再渲染在繼承頁中通過@append添加到被選中分區段的内容，最後渲染被繼承頁的内容。同時，這裏的<p>第三行</p>由於是@stop結尾而沒有被加入，衹視爲不再繼續添加，并抛棄此處的内容。
測試2：
{{--def.blade.php--}} @extends('test.appV2test') @section('title', '測試頁') @section('body') @section('content') <p>第一行</p> @append <p>繼承頁内容1</p> @section('content') <p>第二行</p> @append <p>繼承頁内容2</p> @section('content') <p>第三行</p> @stop @section('content') {{--new addition--}} <p>抛棄前面添加的</p> @override <p>繼承頁内容3</p> @stop
實驗結果：
1 <p>繼承頁内容1</p> 2 <p>繼承頁内容2</p> 3 <html> 4 <head> 5 <title>測試頁</title> 6 </head> 7 <body> 8 <p>body是否被繼承</p> 9 <div> 10 <p>第一行</p> 11 <p>第二行</p> 12 <p>直接被繼承内容1</p> 13 <p>直接被繼承内容2</p> 14 <p>直接被繼承内容3</p> 15 </div> 16 </body> 17 </html>
暫時性結論：
不解。從結果上看，在@override之前的繼承頁的内容，全部被渲染到了最前面，甚至超過了其父節點的範圍。渲染完這些内容後，才開始繼承被繼承頁的内容。同時，本來應該被覆寫的内容被抛去，繼承頁在@override之後的内容也被抛去。其它内容渲染操作與測試1無異。
其它相關
{{ ... }}
自動轉義html標記，使標記原樣輸出
{!! ... !!}
直接打印變量内容，按標記進行相應渲染
@if(...)
@elseif(...)
@else
@endif
判斷
@foreach($lists as $list)
<li>{{$list}}</li>
@empty
<li>You don't have any lists saved.</li>
@endforeach
循環輸出，可通過@empty判斷要循環内容是否爲空
@include('...','...')
引入子文件，第二參數可傳參（不知有何用處，因爲include進來的文件能直接使用主文件的變量）
浙公网安备 33010602011771号