thinkphp-模版的条件判断标签、模版的include加载包含输出、模板的布局和继承
模版的条件判断标签
switch标签
使用{switch}...{/switch}可以实现多个条件判断;
{switch $number}
{case 1}1{/case}
{case 5}5{/case}
{case 10}10{/case}
{default/}不存在
{/switch}
{case}也支持多个条件判断,使用|线隔开即可;
{case 10|20|30}10,20,30 均可{/case}
return View::fetch('condition', [
'number' => 7
]);
{switch $number}
{case 1|2|3|4}1{/case}
{case 5|6|7|8}5{/case}
{case 10}10{/case}
{default/}不存在
{/switch}
{case}后面也可以是变量,设置变量后不可以使用|线;
return View::fetch('condition', [
'number' => 10,
'id' => 10
]);
{switch $number}
{case 1|2|3|4}1{/case}
{case 5|6|7|8}5{/case}
{case $id}10{/case}
{default/}不存在
{/switch}
推荐,只要是变量都加上$符号
编译后的源码 参考学习下
<?php switch($number): case "1": ?>
1
<?php break; case "5": ?>
5
<?php break; case $id: ?>
10
<?php break; default: ?>
不存在
<?php endswitch; ?>
IF 标签
使用简单条件判断的{if}标签;
{if $number >= 0}
OK
{/if}
{if}标签的条件判断可以使用AND、OR 等语法;
{if ($number > 10) OR ($number > 5)}
大于10
{/if}
{if}标签支持{else/}语法;
{if $number >= 0 OR $number > 5}
OK
{else/}
not ok
{/if}
{if}标签也支持{elseif}多重条件判断;
{if $number >= 0 OR $number > 5}
OK
{elseif $number < 5/}
xiaoyu5
{else/}
not ok
{/if}
编译后,参考学习
<?php if($number >= 0 OR $number > 5): ?>
OK
<?php elseif($number < 5): ?>
xiaoyu5
<?php else: ?>
not ok
<?php endif; ?>
{if}标签中的条件判断支持PHP 写法,比如函数和对象调用;
return View::fetch('condition', [
'number' => 10,
'id' => 10,
'name' => 'wu'
]);
{if strtoupper($name) == 'WU'}
相等
{/if}
范围标签
范围标签:{in}和{notin},判断值是否存在或不存在指定的数据列表中;
{in name="$number" value="10,20,30,40"} 存在 {/in}
return View::fetch('condition', [
'number' => 11,
'id' => 10,
'name' => 'wu'
]);
{in name="$number" value="10,20,30,40"}
存在
{else/}
不存在
{/in}
name 值可以是是系统变量,比如$Think.xxx.yyy,value 可以是变量;
范围标签:{between}和{notbetween},判断值是否存在或不存在数据区间中;
{between name="$number" value="10,50"}
存在OK
{/between}
between与in区别:between是范围,比如10-50,而in则是“10,20,30”中的某一个
{between name='number' value='10,50'}存在{/between}
{between name='number' value='10,50'}
存在数据区间中
{else/}
不存在数据区间中
{/between}
between 中的value 只能是两个值,表示一个区间,第三个值会无效;区间不但可以表达数字,也可以是字母,比如a-z,A-Z;
是否存在标签
是否存在:{present}和{notpresent}判断变量是否已经定义赋值(是否存在);
{present name="$abc"}变量已定义{/present} // 因为$abc没定义,所以不会显示
{present name="$number"}变量已定义{/present} // 因为$number已定义 会显示这个
其也支持else
{present name='user'}
user 已存在
{else/}
user 不存在
{/present}
是否为空:{empty}和{notempty}判断变量是否为空值;
{empty name='username'}有值{/empty}
{empty name='username'}
username 有值
{else/}
username 没值
{/empty}
常量是否定义:{defined}和{notdefined}判断常量是否定义(是否存在);
{defined name='PI'}
PI 存在
{else/}
PI 不存在
{/defined}
模版的include加载包含输出
使用{include}标签来加载公用重复的文件,比如头部、尾部和导航部分;
在模版view 目录创建一个public 公共目录,分别创建header 和nav;
模板文件目录如下
app
|-controller
|-Show.php
...
|-view
|-public
|-header.html
|-nav.html
|-show
|-block.html
在block.html中
{include file="public/header" }
{include file="public/nav" }
或者
{include file='public/header,public/nav'/} // 经过测试模板会直接输出 仅记录
也可以包含一个文件的完整路径,包括后缀,如下:
{include file="../view/public/nav.html"/}
模版的标题和关键字,可以通过固定的语法进行传递;
return View::fetch('block', [
'title' => '标题'
]);
{include file="public/header" title="$title"} // 将其传递给header模板
在Header模板中使用
header [title] // 这里使用[],注意title不能加$
如果是多个属性
{include file="public/header" title="$title" keyword="关键字"}
header [title] [keyword]
输出替换
有时,我们需要调用一些静态文件,比如css/js 等;
比如,我们在项目根目录中public/static/js/basic.js和public/static/css/basic.js
在模板中引用
<title>[title]</title>
<link rel="stylesheet" href="../static/css/basic.css">
<script src="../static/js/basic.js"></script>
那么,直接写完整路径,比较繁长,可以把这些路径整理打包;
在config/view.php 中,配置新增一个参数;tpl_replace_string
// 标签库标签结束标记
'taglib_end' => '}',
// 模版替换输出
'tpl_replace_string' => [
'__JS__' => '../static/js',
'__CSS__' => '../static/css',
]
其中设置属性指向特定的目录,然后在特定的模板中,使用变量替换基础路径即可
html 文件调用端,直接通过__CSS__(__JS__)配置的魔术方法调用即可;使用的时候会自动将变量编译为路径。
<link rel="stylesheet" href="__CSS__/basic.css">
<script src="__JS__/basic.js"></script>
在测试的时候,由于是更改的配置文件刷新,每次都要删除编译文件才能生效;
文件加载
传统方式调用CSS 或JS 文件时,采用link 和script 标签实现;系统提供了更加智能的加载方式,方便加载CSS 和JS 等文件;
使用{load}标签和href 属性来链接,不需要设置任何其它参数;
{load href="__CSS__/basic.css"}
{load href="__JS__/basic.js"}
也支持href 多属性值的写法,如下:
{load href='__CSS__/basic.css, __JS__/basic.js'}
{load}还提供了两个别名{js}、{css}来更好的实现可读性,当然个人还是更喜欢Load;
{js href='__JS__/basic.js'}
{css href='__CSS__/basic.css'}
模版的布局和继承
模板布局
默认情况下,不支持模版布局功能,需要在配置文件中开启;
在配置文件config/view.php 中,配置开始模版布局功能;
return [
...
// 模版替换输出
'tpl_replace_string' => [
'__JS__' => '../static/js',
'__CSS__' => '../static/css',
],
// 新增模板布局
'layout_on' => true
];
此时,执行上一节的模版控制器,会发现提示缺少模版layout.html;这个默认的布局文件,是可以更改的,位置和名字均可配置;
// 模板布局
'layout_on' => true,
'layout_name' => 'public/layout', // 这个目录指app/view/public/layout.html
然后在app/view/public/下新建layout.html
这个layout的好处就是公共部分就只有一个文件,不需要再分开引用了。相当于逆向,在模板中写出所有公用的部分,然后在每个模板中写不一样的结构,然后插入到公用模板的{__CONTENT__}处
layout.html 负责所有通用模块的代码部分,而局部内容通过变量引入;
使用{__CONTENT__}类似魔术方法的标签来引入index.html 非通用内容;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{$title}</title>
<!-- <link rel="stylesheet" href="__CSS__/basic.css">
<script src="__JS__/basic.js"></script> -->
{css href="__CSS__/basic.css"}
{js href="__JS__/basic.js"}
</head>
<body>
header [keyword]
{__CONTENT__}
</body>
</html>
上面说的是第一种,配置文件下来开启布局,而第二种方式则不需要开启直接使用;
当然也可以在config/view中关闭掉layout_on等相关配置,然后在个别的模板中,比如app/view/show/block.html中
{layout name="public/layout"}
这里是主题部分
首先,你必须关闭第一种配置,我这里就直接注释掉了,然后使用{layout}标签;也可以达到与上面一样的效果。
再强调:再测试的时候,如果更改了配置文件,务必删除temp 下编译文件再刷新;
你可以更改{__CONTENT__},只要在配置文件中配置;
'layout_item' => '{__REPLACE__}'
{layout name="public/layout" replace='[__REPLACE__]'}
模版继承
模版继承是另一种布局方式,这种布局的思路更加的灵活;
首先,我们要创建一个app/view/public/base.html 的基模版文件,文件名随意,比如base.html;
创建一个新的方法extend ,在view/show/block.html载入新的模版extend.html,然后加载基模版;下面两种方式都可以
{extend name='public/base'}
{extend name='../view/public/base.html'}
在基模版base.html 中,设置几个可替换的区块部分,{block}标签实现;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{$title}</title>
</head>
<body>
{block name="body"}这里是111{/block}
{block name="nav"}这里引入其他文件{/block}
</body>
</html>
然后在block.html模板中
{extend name="public/base"}
{block name="body"}
<em>这里是从block.html中写的</em>
{/block}
{block name="nav"}
{include file="public/nav"}
{/block}
如此,block模板中的name="body"中的内容就会渲染在base模板的name="body"处。
在base.html 中,{include}可以加载内容,而在extend.html 可以改变加载;
{block name='include'}{include file='public/header'}{/block}