您现在的位置是:首页 > thinkphp
thinkphp6 视图模板下的变量的使用
马力 2021-03-23 14:47:57 【thinkphp】 4525人已围观
简介thinkphp6 视图模板下的变量的使用
thinkphp6 视图模板下的变量的使用
模板引擎支持普通标签和XML标签方式两种标签定义,分别用于不同的目的
标签类型 描述
普通标签 主要用于输出变量、函数过滤和做一些基本的运算操作
XML标签 也称为标签库标签,主要完成一些逻辑判断、控制和循环输出,并且可扩展
一、运算符 (自学)
运算符 示例
+ {$a+$b}
- {$a-$b}
* {$a*$b}
/ {$a/$b}
% {$a%$b}
++ {$a++} 或 {++$a}
-- {$a--} 或{--$a}
综合运算 {$a+$b*10+$c}
三元运算符 {$a==$b ? 'yes' : 'no'}
controller文件
public function index(){
View::assign('a',100);
View::assign('b',21);
return View::fetch();
}
view文件
<div>{$a+$b}</div>
<div>{$a-$b}</div>
<div>{$a*$b}</div>
<div>{$a/$b}</div>
<div>{$a%$b}</div>
<div>{$a++}</div>
<div>{++$a}</div>
<div>{$a--}</div>
<div>{--$a}</div>
<div>{$c ? '存在' : '不存在'}</div>
二、模版函数 (自学)
方法 描述
date 日期格式化(支持各种时间类型)
format 字符串格式化
upper 转换为大写
lower 转换为小写
first 输出数组的第一个元素
last 输出数组的最后一个元素
default 默认值
raw 不使用(默认)转义
md5 md5加密
substr 截取字符串
可以多函数调用
controller文件
public function index(){
View::assign('time',1576048640);
View::assign('num',10.0032);
View::assign('str','OUyangKE');
View::assign('arr',[
'朱老师',
'欧阳克',
'西门大官人'
]);
return View::fetch();
}
view文件
<div>{$time|date='Y-m-d H:i:s'}</div>
<div>{$num|format='%02d'}</div>
<div>{$str|upper}</div>
<div>{$str|lower}</div>
<div>{$arr|first}</div>
<div>{$arr|last}</div>
<div>{$default|default="欧阳克"}</div>
<div>{$str|substr=0,3}</div>
<div>{$str|md5}</div>
<div>{$str|lower|substr=0,3}</div>
三、循环标签
foreach 标签的用法和PHP语法非常接近,用于循环输出数组或者对象的属性
controller文件
public function index(){
$arr = [
[
'id' => 1,
'name' => '欧阳克'
],
[
'id' => 2,
'name' => '朱老师'
],
[
'id' => 3,
'name' => '西门大官人'
]
];
View::assign('arr',$arr);
return View::fetch();
}
view文件
{foreach $arr as $v}
<div>
<span>ID:{$v['id']}</span>
<span>姓名:{$v['name']}</span>
</div>
{/foreach}
四、volist 循环标签
二维数组的结果输出
name 模板赋值的变量名称
id 当前的循环变量,可以随意起名
key 下标,从1开始,默认变量i
offset 开始行数
length 获取行数
empty 如果数据为空,显示此文字
view文件
{volist name="arr" id="v" key="k" offset="1" length="2"}
<div>
<span>ID:{$v['id']}</span>
<span>姓名:{$v['name']}</span>
<span>下标:{$k}</span>
</div>
{/volist}
五、if 判断标签
if 标签的用法和PHP语法非常接近,用于条件判断
controller文件
public function index(){
View::assign('status',1);
View::assign('order_status',4);
return View::fetch();
}
view文件
{if $status == 1}
<div>开启</div>
{/if}
{if $status == 0}
<div>关闭</div>
{else/}
<div>开启</div>
{/if}
{if $order_status == 0}
<div>未支付</div>
{elseif $order_status == 1/}
<div>已支付 待发货</div>
{elseif $order_status == 2/}
<div>已发货 待收货</div>
{elseif $order_status == 3/}
<div>已收货 待评论</div>
{elseif $order_status == 4/}
<div>已完成</div>
{/if}
六、switch 判断标签
switch 标签的用法和PHP语法非常接近,用于条件判断
view文件
{switch $order_status}
{case 0 }<div>未支付</div>{/case}
{case 1 }<div>已支付 待发货</div>{/case}
{case 2 }<div>已发货 待收货</div>{/case}
{case 3 }<div>已收货 待评论</div>{/case}
{case 4 }<div>已完成</div>{/case}
{/switch}
七、包含文件
include 标签,引入模版文件
load 标签,引入资源文件(css、js)
view文件,把头部和尾部分文件
{include file="public/header" /}
{include file="public/left" /}
{load href="/static/layui/css/layui.css" /}
{load href="/static/layui/layui.js" /}
{include file="public/tail" /}
八、其他标签(自学)
条件标签
标签 描述
in 判断变量是否存在某些值
notin 判断变量是否不存在某些值
between 判断变量是否存在某些值
notbetween 判断变量是否不存在某些范围值
present 判断某个变量是否 已定义
notpresent 判断某个变量是否 未定义
empty 判断某个变量是否为空
notempty 判断某个变量是否不为空
defined 判断某个常量是否 已定义
notdefined 判断某个常量是否 未定义
比较标签
标签 描述
eq 等于
neq 不等于
gt 大于
egt 大于等于
lt 小于
elt 小于等于
heq 恒等于
nheq 不恒等于
循环标签
标签 描述
for 计数循环
杂项标签
标签 描述
literal 原样输出
php 使用原生php代码
九、示例
controller代码
namespace app\controller;
use think\facade\View;
class Index{
public function index(){
$title = '商城';
$login = '欧阳克';
$left = [
[
'title' => '商品管理',
'lists' => [
[
'id' => 1,
'title' => '商品列表',
],
[
'id' => 2,
'title' => '商品分类',
]
]
],
[
'title' => '用户管理',
'lists' => [
[
'id' => 3,
'title' => '用户列表',
],
[
'id' => 4,
'title' => '购物车',
],
[
'id' => 5,
'title' => '用户地址',
],
[
'id' => 6,
'title' => '订单管理',
]
]
],
[
'title' => '后台管理',
'lists' => [
[
'id' => 7,
'title' => '管理员列表',
],
[
'id' => 8,
'title' => '个人中心',
],
[
'id' => 9,
'title' => '左侧菜单列',
]
]
]
];
$right = [
[
'id' => 1,
'title' => '熙世界2019秋冬新款长袖杏色上衣连帽宽松刺绣文艺落肩袖加厚卫衣BF风',
'cat' => '女装',
'price' => 189,
'discount' => 6,
'status' => 1,
// 'status' => '开启',
'add_time' => '2019-12-12',
// 'add_time' => '1576080000'
],
[
'id' => 2,
'title' => '秋水伊人双面呢冬装2019年新款女装气质西装领撞色羊毛大衣外套女',
'cat' => '女装',
'price' => 699,
'discount' => 7,
'status' => 1,
// 'status' => '开启',
'add_time' => '2019-12-12',
// 'add_time' => '1576080000'
],
[
'id' => 3,
'title' => '微弹中高腰直脚牛仔裤男',
'cat' => '男装',
'price' => 179,
'discount' => 8,
'status' => 0,
// 'status' => '开启',
'add_time' => '2019-12-12',
// 'add_time' => '1576080000'
],
[
'id' => 1,
'title' => '男士长袖t恤秋季圆领黑白体恤T 纯色上衣服打底衫',
'cat' => '男装',
'price' => 99,
'discount' => 9,
'status' => 1,
// 'status' => '开启',
'add_time' => '2019-12-12',
// 'add_time' => '1576080000'
],
];
View::assign([
'title' => $title,
'login' => $login,
'left' => $left,
'right' => $right
]);
return View::fetch();
}
}
view代码:head.html
<!DOCTYPE html>
<html>
<head>
<title>{$title}--后台管理系统</title>
<link rel="stylesheet" type="text/css" href="/static/layui/css/layui.css">
<script type="text/javascript" src="/static/layui/layui.js"></script>
<style type="text/css">
.header{width:100%;height: 50px;line-height: 50px;background: #2e6da4;color:#ffffff;}
.title{margin-left: 20px;font-size: 20px;}
.userinfo{float: right;margin-right: 10px;}
.userinfo a{color:#ffffff;}
.menu{width: 200px;background:#333744;position:absolute;}
.main{position: absolute;left:200px;right:0px;}
.layui-collapse{border: none;}
.layui-colla-item{border-top:none;}
.layui-colla-title{background:#42485b;color:#ffffff;}
.layui-colla-content{border-top:none;padding:0px;}
.content span{background: #009688;margin-left: 30px;padding: 10px;color:#ffffff;}
.content div{border-bottom: solid 2px #009688;margin-top: 8px;}
.content button{float: right;margin-top: -5px;}
</style>
</head>
<body>
<div class="header">
<span class="title"><span style="font-size: 20px;">{$title}</span>--后台管理系统</span>
<span class="userinfo">【{$login}】<span><a href="javascript:;">退出</a></span></span>
</div>
view代码:left.html
<div class="menu" id="menu">
<div class="layui-collapse" lay-accordion>
{foreach $left as $k=>$left_v}
<div class="layui-colla-item">
<h2 class="layui-colla-title">{$left_v.title}</h2>
<div class="layui-colla-content {if $k==0}layui-show{/if}">
<ul class="layui-nav layui-nav-tree">
{foreach $left_v['lists'] as $lists_v}
<li class="layui-nav-item"><a href="index.html">{$lists_v.title}</a></li>
{/foreach}
</ul>
</div>
</div>
{/foreach}
</div>
</div>
view代码:bottom.html
</body>
</html>
<script>
layui.use(['element','layer','laypage'], function(){
var element = layui.element;
var laypage = layui.laypage;
$ = layui.jquery;
layer = layui.layer;
resetMenuHeight();
});
// 重新设置菜单容器高度
function resetMenuHeight(){
var height = document.documentElement.clientHeight - 50;
$('#menu').height(height);
}
</script>
view代码:index.html
{include file="public/head" /}
{include file="public/left" /}
<div class="main" style="padding:10px;">
<div class="content">
<span>商品列表</span>
<div></div>
</div>
<table class="layui-table">
<thead>
<tr>
<th>ID</th>
<th>商品标题</th>
<th>分类</th>
<th>原价</th>
<th>折扣</th>
<th>现价</th>
<th>库存</th>
<th>状态</th>
<th>添加时间</th>
</tr>
</thead>
<tbody>
{volist name="right" id="right_v"}
<tr>
<td>{$right_v.id}</td>
<td>{$right_v.title}</td>
<td>{$right_v.cat}</td>
<td>{$right_v.price}</td>
<td>{$right_v.discount}</td>
<td>
{if $right_v.discount!=0}
{$right_v.price*($right_v.discount/10)}
{else/}
{$right_v.price}
{/if}
</td>
<td>{$right_v.stock}</td>
<td>{if $right_v['status']==1}开启{else/}关闭{/if}</td>
<td>{$right_v.add_time|date='Y-m-d'}</td>
</tr>
{/volist}
</tbody>
</table>
</div>
{include file="public/bottom" /}
很赞哦! (0)