Twig 模板渲染前端基本使用

Posted 2021-09-03 VE视频引擎

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 %}