Twig 模板渲染前端基本使用
2021/8/19 8:06:19
本文主要是介绍Twig 模板渲染前端基本使用,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
1.{% … %}、{{ … }}、{# … #}
{% for item in list %} {{ item }} {% endfor %}
{{…}} 用来输出模板表达式的结果{{ item }}
{# … #}
用来注释代码{# <div>{{ item }}</div> #}
2.循环
{% for key,item in list %} <div>{{ key }}---{{ item['user'] }}</div> <div>{{ loop.index }}</div> {% endfor %} key--list数组循环的下标, item--每次循环数组里面的 对象,例{user:'123',num:'1'},取对象里面的值可以使用 item['user'] 或 item.user 循环体内部变量: loop.index 循环的次数(从1开始) loop.index0 循环的次数(从0开始) loop.revindex 循环剩余次数(最小值为1) loop.revindex0 循环剩余次数(最小值为0) loop.first 当第一次循环的时候返回true loop.last 当最后一次循环的时候返回true loop.length 循环的总数 loop.parent 被循环的数组 循环必须有 结束 {% endfor %}
3.判断
{% for key,item in list %} <div>{{ key }}---{{ item['user'] }}</div> {% endfor %} {% elseif list|length > 0 %} <div> 多次判断条件 </div> {% else %} <div> 多次判断条件 </div> {% endif %} | -- 代表过滤器,判断 list 长度是否大于 0 if 判断 必须有 结束 {% endif %} {% if list is null %} <div> 判断是否为 null </div> {% endif %} {% if list is not defined %} <div> 判断是否定义 </div> {% endif %} {% if list or list|length >0 %} <div> 或者 判断使用 or </div> {% endif %} {% if list and list|length >0 %} <div> 并且 判断使用 and </div> {% endif %} 循环中 判断 {% for key,item in list if item.user == '456' %} <div>{{ key }}---{{ item['user'] }}</div> {% endfor %} 循环 也可以 if 判断组合使用,这样输出的就会是 1---456,数组中其他两个就不会渲染出来
4.自动转义
Twig 1.8 版本前 {% autoescape true %} 此处内容以HTML转义策略进行自动转义 {% endautoescape %} {% autoescape false %} 此处的内容以原本的样子输出,不转义 {% endautoescape %} Twig 1.8 以上 {% autoescape %} 此处内容以HTML转义策略进行自动转义 {% endautoescape %} {% autoescape 'html' %} 此处内容以HTML转义策略进行自动转义 {% endautoescape %} {% autoescape 'js' %} 此处内容以JS转义策略进行自动转义 {% endautoescape %} {% autoescape false %} 此处的内容以原本的样子输出,不转义 {% endautoescape %}
5.过滤器 |
default:当所修饰的数据不存在或为空时,提供默认值。如 {{ ''|default('默认') }} sort:对数组排序 keys:将数组的全部键名提取成一个数组 length:返回数组元素的个数或字符串的长度 lower:将字符串所有字母全部变成小写 upper:将字符串所有字母全部变成大写 title:将字符串中每个单词的首字母大写 split:将字符串分割成数组
6.几个用到的函数
even:是否为偶数,如 {% if i is even %} odd:是否为奇数,如 {% if i is odd %} empty:是否为空,如 {% if i is empty %} null:是否为 null,如 {% if i is null %} defined:是否已定义,如 {% if i is defined %}
这篇关于Twig 模板渲染前端基本使用的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-11-15AntDesign项目实战:新手入门与初级应用教程
- 2024-11-15AntDesign-Form-rules项目实战:新手指南
- 2024-11-14ESLint课程:初学者指南
- 2024-11-14Form.List 动态表单课程:新手入门教程
- 2024-11-14Redux课程:新手入门完全指南
- 2024-11-13MobX 使用入门教程:轻松掌握前端状态管理
- 2024-11-12前端编程资料:新手入门指南与初级教程
- 2024-11-12前端开发资料入门指南
- 2024-11-12前端培训资料:适合新手与初级用户的简单教程
- 2024-11-12前端入门资料:新手必读指南