您现在的位置是：首页 > thinkphp

thinkphp6 视图模板下的变量的使用

马力 2021-03-23 14:47:57 【thinkphp】 4395人已围观

简介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)

上一篇：laravel的上线配置操作

下一篇：swoole实现一个简单的网页版pvp（多人对战）贪吃蛇