zoukankan      html  css  js  c++  java
  • Laravel 5 基础(四)- Blade 简介

    在多个页面中我们可能包含相同的内容,像是文件头,链接的css或者js等。我们可以利用布局文件完成这个功能。

    让我们新建一个布局文件,例如 views/layout.blade.php

    <!doctype html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css">
    </head>
    <body>
        <div class="container">
            @yield('content')
        </div>
    </body>
    </html>
    

    我们创建了不解的结构,引入了bootstrap,注意 @yield 是blade的布局占位符,未来我们的页面内容将填充到这里,修改 about.blade.php

    @extends('layout')
    
    @section('content')
        
    <h1>About {{ $first }} {{ $last }}</h1>
    
    @stop
    

    上面的代码表示我们使用布局文件 layout.blade.php, 然后在 content 段中添加内容。

    routes.php 中添加:

    Route::get('about', 'PagesController@about');
    Route::get('contact', 'PagesController@contact');
    

    PagesController.php 中添加:

        public function contact() {
            return view('pages.contact');
        }
    

    新建视图 pages/contact.blade.php

    @extends('layout')
    
    @section('content')
        <h1>Contact Me!</h1>
    @stop
    

    Check it out!

    在布局文件中我们可以添加多个 @yield , 比如在 layout.blade.php 中添加 @yield('footer')

    <!doctype html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.4/css/bootstrap.min.css">
    </head>
    <body>
        <div class="container">
            @yield('content')
        </div>
    
        @yield('footer')
    </body>
    </html>
    

    比如 contact.blade.php 中有一段脚本,就可以放在这个段中。

    @extends('layout')
    
    @section('content')
        <h1>Contact Me!</h1>
    @stop
    
    @section('footer')
        <script>
            alert('Contact from scritp')
        </script>
    @stop
    

    访问contact会有对话框,而about仍然是普通显示

    • 使用 @if 进行判断
    @extends('layout')
    
    @section('content')
        @if ($first = 'Zhang')
            <h1>Hello, Zhang</h1>
        @else
            <h1>Hello, nobody</h1>
        @endif
    @stop
    

    也可以视同 @unless 等同于 if !, 还有 @foreach 等。

        public function about()
        {
            $people = [
                'zhang san',
                'li si',
                'wang wu'
            ];
            return view('pages.about', compact('people'));
        }
    
    @extends('layout')
    
    @section('content')
        <h1>Person:</h1>
        <ul>
            @foreach($people as $person)
                <li>{{ $person }}</li>
            @endforeach
        </ul>
    @stop
    

    有一种情况,数据可能来自数据库,集合可能是空,像是这样:

    $people = [];
    

    处理这种情况,请添加 @if 处理

    @extends('layout')
    
    @section('content')
        @if (count($people))
            <h1>Person:</h1>
            <ul>
                @foreach($people as $person)
                    <li>{{ $person }}</li>
                @endforeach
            </ul>
        @endif
    
        <h2>Other info</h2>
    @stop
    

    That's better.

  • 相关阅读:
    第五次作业
    第四次作业
    软件工程(第二次作业)
    读软件工程这本书的感悟(第一次作业)
    第五次作业
    软件工程第四次作业
    软件工程第二次作业
    软件工程第二次作业
    什么样的书叫做好书,大学的教育到底培养的是什么?
    软件工程学习的问题:
  • 原文地址:https://www.cnblogs.com/ZhangJinglin/p/4382670.html
Copyright © 2011-2022 走看看