zoukankan      html  css  js  c++  java
  • lavarel模板引擎blade学习

    blade 模板学习

    特点

    主要的两个优点是:模板继承和区块

    继承页面布局

    布局文件(layout.php) + 详情文件 (page.php) 的组合,即一般到具体的组合。在blade文件之中的体现为:

    在详情视图文件之中“继承”布局文件。如:

    在详情文件(page.php)头部使用命令@extend(“layout.php”)

    在yii或handbar模版之中,都有占位符,同样地也类似于vue之中的父子组件之间的传值,在blade模版之中,在父模版之中@yield命令来显示子模板之中的区块名,并且在子模板以@section()和@endsection()来“声明”区块。(基于这个继承关系,姑且称为父模板与子模板)。

    此外,blade支持{{ $name }},这样的类似其他模版引擎的语法引入变量。而容易与前端的模板引擎冲突,如arttemplate(简明语法),vue的取值表达式相互冲突,blade提供的解决方案是:在双花括号之前加上@,eg:

    <h1>laravel</h>
    halo,@{{name}}
    

    当大片使用javascript变量的时候,可以使用@verbatim指令包裹html内容,这样就不需要为每个需要解析的变量增加@符号前缀:

    @verbatim
        <div class ="container">
    
            Hello,{{name}}
    
        </div>    
    @endverbatim
    

    结构控制

    /*if ...else ...*/
    @if(count($records) === 1)
        我有一条记录!
    @elseif(count($records > 1))
        我有多条记录!
    @else
        我没有任何记录!
    @endif
    
    /*for... foreach... empty... empty...*/
    @for($i = 0 ; $i < 10 ; $i++>)
        目前的值为 {{ $i }}
    @endfor
    
    @foreach($users as $user)
        <p>此用户为 {{ $user->id }}</p>
    @endforeach
    
    @empty
        <p>没有用户</p>
    @empty
    
    @while(true)
        dead loop
    @endwhile
    
    

    在循环之中,可以使用$loop这个预定义的变量来获取一些关于循环的一些特效,特别的是在嵌套循环之中,可以通过$loop预定义对象来的parent来获取父循环中的$loop变量。如:

    @foreach ($users as $user)
    
        @foreach($user->posts as $post)
    
            @if($loop->parent->first)
    
                This is first iteration of the parent loop.
    
            @endif
    
        @endforeach
    
    @endforeach
    

    $loop 这个预定义变量包含的属性如下。

    属性描述
    $loop->index当前循环所迭代的索引,起始为 0。
    $loop->iteration当前迭代数,起始为 1。
    $loop->remaining循环中迭代剩余的数量。
    $loop->count被迭代项的总数量。
    $loop->first当前迭代是否是循环中的首次迭代。
    $loop->last当前循环的嵌套深度。
    $loop->depth当前循环所迭代的索引,起始为 0。
    $loop->parent当在嵌套的循环内时,可以访问到父循环中的 $loop 变量。

    php

    当在页面之中引用少量的php代码的时候,可使用@php指令。如

    @php
        // php codes go here...
    @endphp
    

    引入子视图

    blade的@include命令来引用已存在的视图,所有在父试图的可用变量在被引入的视图中都是可用的。如:

    <div>
        @include('shared.errors')
        <from>
            <!-- 表单内容 -->
        </from>
    </div>
    

    除了继承父试图中的所有数据,也可以通过传递额外的数组数据至被引用的页面:

    @include('view.name',['some'=>'data'])
    

    其他blade 功能不常用,不做分析...

  • 相关阅读:
    基于 RocketMQ Prometheus Exporter 打造定制化 DevOps 平台
    RocketMQ-Console安装及RocketMQ命令行管理工具介绍
    RocketMQ之一:RocketMQ整体介绍
    Prometheus 监控之 zookeeper
    详解MySQL数据类型
    Linux2:Linux目录结构
    再谈AbstractQueuedSynchronizer3:基于AbstractQueuedSynchronizer的并发类实现
    再谈AbstractQueuedSynchronizer2:共享模式与基于Condition的等待/通知机制实现
    Java虚拟机15:再谈四种引用状态
    再谈AbstractQueuedSynchronizer1:独占模式
  • 原文地址:https://www.cnblogs.com/lakeInHeart/p/7264390.html
Copyright © 2011-2022 走看看