15.)PHPWeb开发框架~Laravel中视图创建及模板渲染等操作讲解

2021年06月23日 10:34:52阅读数:167博客 /  一纸荒凉* Armani / Laravel

1、视图写哪里?

视图包含应用程序的 HTML,并且将控制器 / 应用程序逻辑与演示逻辑分开。视图文件存放于 resources/views 目录下。

img

一个简单的视图如下所示:

<!-- 此视图文件位置 resources/views/greeting.blade.php --><html>    <body>        <h1>Hello, {{ $name }}</h1>    </body></html>

该视图文件位于 resources/views/greeting.blade.php, 可以使用全局辅助函数 view 将其返回:

Route::get('/', function () {    return view('greeting', ['name' => 'James']);});

如你所见, 传递给 view 辅助函数的第一个参数对应 resources/views 目录中视图文件的名称。第二个参数是应该可供视图使用的数据数组。在这种情况下,我们传递 name 变量,该变量将使用 Blade syntax 在视图中显示。

当然,视图文件也可以嵌套在 resources/views 目录的子目录中。「点」符号可以用来引用嵌套视图。例如,如果你的视图存储在 resources/views/admin/profile.blade.php,则可以这样引用它:

return view('admin.profile', $data);

注意:视图目录名中不应该包含 . 字符。

2、视图文件的命名与渲染

(1)文件名习惯小写(建议小写)

(2)文件名的后缀是 .blade.php(因为laravel里面有一套模板引擎就是使用blade,可以直接使用标签语法{{ $title }}, 也可以使用原生的php语法显示数据。)

(3)需要注意的是也可以使用.php结尾,但是这样的话就不能使用laravel提供的标签{{ $title }}语法显示数据,只能使用原生语法<?php echo $title;?>显示数据

两个视图文件同时存在,则.blade.php后缀的优先显示。

案例:编写一路由地址,调用控制器的test3方法,展示视图test3文件(创建2个,一个以.blade.php结尾,另外一个.php结尾)

img

编写控制器方法:

展示视图的方法:

Return view(‘视图文件的名称’);

视图可以进行分目录管理的,例如需要展示home/test/test3视图,则可以写成:

return view(‘home/test/test3’) // 当然也支持点写法:return view(‘home.test.test3’)

展示方法:

img

img

img

3、向视图传递参数与渲染展示

语法:

①view(模板文件名称,数组)       数组就是需要分配的变量集合,数组是一个键值数组,其键与变量名尽量一致

②view(模板文件名称)->with(数组)

③view(模板文件名称)->with(名称,值)->with(名称,值)

正如在前面的示例中所看到的,可以将一组数据传递给视图:

return view('greetings', ['name' => 'Victoria']);

以这种方式传递信息时,数据应该是具有键 / 值对的数组。在视图中,可以使用相应的键访问每个值,例如 <?php echo $key; ?>。作为将完整的数据数组传递给 view 辅助函数的替代方法,您可以使用 with 方法将各个数据片段添加到视图中:

return view('greeting')->with('name', 'Victoria');

Blade 模板:https://learnku.com/docs/laravel/7.x/blade/7470

使用view()方式渲染一个视图后,在.blade.php的视图文件中,模板中输出变量使用“{{ $变量名 }} ”(变量名就是分配过来数组的键)

img

在视图中展示刚才传递的变量:

img

显示效果:

img

显示数据

可以将变量放在大括号中传递到 Blade 视图中显示。比如给出如下路由:

Route::get('greeting', function () {    return view('welcome', ['name' => 'Samantha']);});

就可以这样利用 name 变量显示其内容:

Hello, {{ $name }}

技巧:Blade{{ }} 语句是自动经过 PHP 的 htmlspecialchars 函数转义以防范 XSS 攻击。

不仅仅可以显示传递给视图的数据,也可以显示任意 PHP 函数的执行结果。实际上,你可以在 Blade 的回显语句中放置你想要的任意 PHP 代码:

当前时间:{{ time() }}

显示非转义字符

默认情况下, Blade 中 {{ }} 语句自动经由 PHPhtmlspecialchars 函数转义以防范 XSS 攻击。 如果你不希望数据被转义,可以使用下面的语法:

Hello, {!! $name !!}.

注意:在显示用户提供的内容时需要谨慎小心。在显示用户提供的数据时,有必要一直使用双花括号语法转义来防范 XSS 攻击。

4、扩展:compact函数使用(传参)

Compact函数,是php内置函数跟laravel框架没有关系。作用主要是用于打包数组的。

语法:compact(‘变量名1’,’变量名2’,…);

因此刚才3中的案例还可以写成:

img

5、模板中直接使用函数

回顾:在smarty模版引擎中存在一个特殊的符号“|”,名称称之为变量修饰符。作用就是在视图中解释变量(使用函数去处理变量)。

在laravel中。视图调用函数其语法基本与js、php的语法一致,只不过要求左右包含大括号:

语法:{{函数名(参数1,参数2…)}}

说明:函数名可以是php内置的,也可以是laravel框架中定义的。

案例:在数据库中一般存储时间都是以时间戳去存储的,但是在页面上展示的时候不适合使用时间戳了。需要在展示的时候再对其进行格式化处理,如需要在视图中进行对其格式化则怎么写?

img

分析:在php中怎么格式化时间戳?使用date函数

语法:date(格式,时间戳)

img

显示效果:

img

如果需要使用更多的函数,则需要遵循函数的语法格式即可。

6、循环与分支语法标签【重点】

Blade 是 Laravel 提供的一个简单而又强大的模板引擎。和其他流行的 PHP 模板引擎不同,Blade 并不限制你在视图中使用原生 PHP 代码。所有 Blade 视图文件都将被编译成原生的 PHP 代码并缓存起来,除非它被修改,否则不会重新编译,这就意味着 Blade 基本上不会给你的应用增加任何负担。Blade 视图文件使用 .blade.php 作为文件扩展名,被存放在 resources/views 目录。

在视图里面遍历数据【重点】

Blade 还提供了用于处理 PHP 循环结构的简单指令。同样,这些指令中的每个函数的功能都与对应的 PHP 的函数功能相同:

@for ($i = 0; $i < 10; $i++)    The current value is {{ $i }}@endfor@foreach ($users as $user)    <p>This is user {{ $user->id }}</p>@endforeach@forelse ($users as $user)    <li>{{ $user->name }}</li>@empty    <p>No users</p>@endforelse@while (true)    <p>I'm looping forever.</p>@endwhile

使用循环时,您也可以结束循环或跳过当前迭代:

@foreach ($users as $user)    @if ($user->type == 1)        @continue    @endif    <li>{{ $user->name }}</li>    @if ($user->number == 5)        @break    @endif@endforeach

在laravel中模版中循环输出数据,则需要遵循语法:

img

案例:使用循环标签的语法,在视图中输出数据

①定义路由

img

②创建需要的方法,获取一些数据,传递给视图

img

③创建需要的视图文件home.test.test4

img

输出的效果:

img

在此过程中需要注意的就是get查询到的结果集中每一条记录其实都是一个对象,因此在循环具体字段的时候需要注意使用对象调用属性的方式才可以获取其数据。

在视图里面可以执行if判断【重点】

你可以使用 @if, @elseif, @else, 和 @endif 指令来构造 if 语句。这些指令的功能与它们在 PHP 中对应的语句功能相同:

@if (count($records) === 1)    我有一条记录!@elseif (count($records) > 1)    我有好多条记录!@else    我没有记录!@endif

为了方便,Blade 也提供了一个 @unless 指令

@unless (Auth::check())    You are not signed in.@endunless

除了已经讨论过的条件指令之外, @isset@empty 指令还可以用作各自 PHP 函数的快捷方式:

@isset($records)    // 变量 $records 已定义且不为空...@endisset@empty($records)    // 变量 $records 为空...@endempty

Switch 语句可以使用 @switch, @case, @break, @default@endswitch 指令来构造:

@switch($i)    @case(1)        First case...        @break    @case(2)        Second case...        @break    @default        Default case...@endswitch

If语法在模版引擎中的写法:

img

案例:要求在php代码中(控制器的方法)动态输出今天的星期数字(1-7),将数字传递给视图,显示出今天是星期几,如假设传递的数字是7,则页面中要输出“星期天”【将数字转化成汉字】

img

可以使用N格式化标记输出今天的星期数字

控制器的代码:

img

需要在视图中进行相关的判断操作:

img

7、模版继承/包含【理解】

img

继承不仅仅在php类中存在,在视图中同样存在。一般是用于做有公共部分的页面

在定义一个子视图时,使用 Blade 的 @extends 指令指定子视图要「继承」的视图。扩展自 Blade 布局的视图可以使用 @section 指令向布局片段注入内容。就如前面的示例中所示,这些片段的内容将由布局中的 @yield 指令控制显示:

案例:编写父级页面,再编写一个子页面(相当于php中的两个类)

编写父级页面:

语法:@yield(‘名字’)         在父级页面中的占位

img

编写子页面:(可以用之前的模版直接集成刚才父级页面,例如使用test4页面),编写的子页面不需要再去写头和尾,因为首尾父页面已经有了:

img

展示子页面;

img

img

继承语法:

子模版中按以下语法书写:

@extends(‘需要继承的模版文件名’) // 其名称要是完整的路径 // **通过section标签绑定区块/部件到父级页面,区块名称就是父级页面yield标签的参数名**。@section(区块名称)代码@endsction

img

模版包含:

语法:@include(模版文件名)       文件名不含后缀,语法类似view方法参数

img

8、外部静态文件引入方式(了解)

在写页面肯定会引入相关的外部文件(js、css、image),则会涉及到路径的问题。

以下面的这个app.css为例,看如何去引入该css文件:

img

以往的引入方式:

img

在laravel中系统封装了一个方法asset:

img

最后的显示效果:

img

Asset方法中的参数可以是多级目录也可以是单级目录。

版权申明:本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!

全部评论

文明上网理性发言,请遵守新闻评论服务协议

条评论
  • 博主信息
     一纸荒凉* Armani
    博文
    129
    粉丝
    4
    评论
    5
    访问量
    49904
    积分:0
    P豆:318
    博文分类
    html3篇
    CSS11篇
    JavaScript16篇
    jQuery2篇
    Vue11篇
    PHP20篇
    ThinkPHP33篇
    React0篇
    other5篇
    Laravel21篇
    小程序5篇