Flask 模板基础知识 (二)

Flask模板

1.1 模板引擎  

  Flask 使用 Jinja2 作为默认模板引擎

1.2 默认配置

  template_folder='templates'——模板的默认目录

  render_template() ——(x)html自动转义

  render_template_string() ——字符串自动转义

  {% autoescape %} ——手动设置是否转义

  全局函数和辅助对象——增强模板的功能

 1.2 转义

  把有特殊意义的字符显示出来html标签中的<>——&lt;&gt;代码中的&——&amp;

  特殊字符转义对照表>>https://tool.oschina.net/commons?type=2

1.3 全局对象

  config——Flask的配置信息

  request——请求对象

  session——会话对象

  g——请求相关的全局变量(如:g.user)

1.4 全局函数

  url_for():URL解析函数(如:静态文件地址解析、链接跳转地址解析)

  get_flashed_messages():会话消息

1.5 上下文处理器

  在模板的上下文中添加新的内容

  内容可以是变量,也可以是函数

  @app.context_processor 

  def inject_user():

    return dict(user=g.user)

1.6 模板中变量的使用

  渲染机制

    模板引擎怎样在浏览器展示HTML

    从磁盘读取html字符串

    将满足特定规则的内容进行替换

    发送给浏览器展示

  变量的使用

    语法:”{{ object.attribute }}或{{ object['attribute'] }}

    dict类型数据的渲染

    list/tuple类型数据的渲染

    list/tuple嵌套dict复杂类型数据的渲染

1.7 模板语法

  模板标签 

    语法:  {%  tag  %}

        {%  tag  %}内容{%  endtag  %}

    标签中可包含表达式:如:if条件控制

    条件表达式 :

      {% if condition_a %}

        满足了A条件

      {% elif condition_b %}

        满足了B条件

      {% else %}

        都不满足

      {% endif %}

    if标签中的is判断:

      {% if value is defined %}

        …..

      {% endif %}

    内置的判断条件:

      defined/undefined——变量是否已经定义

      none——变量是否为None 

      number/string——数字/字符串判断

      even/odd——奇偶判断

      upper/lower——大小写判断

    if标签中的其他逻辑控制:

      and,  or == , !=

      > , < >= , <=

      in,  not  in

     for循环 :

      <ul>

        {% for key, value in data. iteritems() %}

          <li class="{{ loop.cycle('odd', 'even') }}">

          {{ key }}: {{ value }}

          </li>

        {% else %}

          <li>暂无数据</li> {% endfor %}

      </ul>

    for循环体内的变量:

      变量               描述

      loop.index       当前循环迭代的次数(从 1 开始)

      loop.index0          当前循环迭代的次数(从 0 开始)

      loop.revindex       到循环结束需要迭代的次数(从 1 开始)

      loop.revindex0     到循环结束需要迭代的次数(从 0 开始)

      loop.first         如果是第一次迭代,为 True

      loop.last         如果是最后一次迭代,为 True

      loop.length       序列的长度

      loop.cycle        在一串序列间期取值的辅助函数

    如果要在for循环中使用continue/break怎么办?

      jinja_env = Environment(extensions=['jinja2.ext.loopcontrols'])

      {% for user in users %}

      {%- if loop.index is even %}{% continue %}{% endif %} ...

      {% endfor %}

      添加其它扩展参考>>http://docs.jinkan.org/docs/jinja2/extensions.html

    添加注释

      不会显示在浏览器的HTML中:{# 注释内容 #}

    去除HTML中多余的空白:在块的开始或结束放置一个减号( - ),不能有空格

      {% for item in seq -%}

        {{ item }}

      {%- endfor %}

    设置变量,赋值操作

      先设置,后使用,可以通过import导入{% set key, value = (1, 2) %}

    使用with代码块,实现块级作用域

      {% with %}

        {% set value = 42 %}

        {{ value }} 只在代码块中有效

      {% endwith %}

  过滤器

    什么是过滤器

      过滤器:修改变量(如:格式化显示)

      用管道符号( | )分割   {{ name|striptags }}

      可以链式调用   {{ name|striptags|title }}

      可以用圆括号传递可选参数 {{ list|join(', ') }}

    过滤器的使用

      方式一:用管道符号( | ){{ value|safe }}

      方式二:使用标签

        {% filter upper %}

          This text becomes uppercase 

        {% endfilter %}

    内置的过滤器

      求绝对值:{{ value|abs }}

      默认值显示 :default(value, default_value=' ', boolean=False)

        {{ value|default('默认值') }} 

        {{ value|d('默认值') }}

      html转义: {{ value | escape }} 或 {{ value | e }}

      富文本内容转义显示: {{ value|safe }}

      倒序显示: {{ value|reverse }}

      更多内容>>http://docs.jinkan.org/docs/jinja2/templates.html#builtin-filters

    自定义过滤器

      方式一:使用装饰器注册

      @app.template_filter('reverse') 

      def reverse_filter(s):

        return s[::-1]

      方式二:调用函数注册

      def reverse_filter(s):

        return s[::-1]

      app.jinja_env.filters['reverse'] = reverse_filter

    转义显示

      方式一:视为字符串

        {{ '{{ }} {% %}' }}

      方式二:使用raw标签

        {% raw %}

        {% for key, value in data.items %}

          {{ key }}: {{ value }}

        {% endfor %} {% endraw %}

1.8 模板全局函数

  全局函数可在模板中直接使用

    示例:

    <ul>

    {% for i in range(10) %}

      <li>{{ i }}</li> 

    {% endfor %}

    </ul>

  range([start], stop[, step])

  dict(**items)

  cycler(*items)——可用于css类名的循环

  joiner(sep=‘, ’)——可用于字符串拼接

1.9 模板中的宏

  把常用功能抽取出来,实现可重用

  简单理解:宏≈函数

  ignore miss

  宏可以写在单独的html文件中

  定义宏——像书写函数一样定义宏

    {% macro input(name, value='', type='text', size=20) -%}

    <input type="{{ type }}" name="{{ name }}" value="{{value|e }}" size="{{ size }}">

    {%- endmacro %}

  使用宏——像调用函数一样调用

  <p>{{ input('username') }}</p>

  <p>{{ input('password', type='password') }}</p>

  文件中宏的使用

    1. 将前面定义的宏保存为forms.html

    2. 导入:

      {% import 'forms.html' as forms %} {% from 'forms.html' import input %}

    3. 使用:<p>{{ forms.input('username') }}</p>

2.0 模板的继承

  继承实现

    步骤一:将可变的部分圈出来(base.html)

      {% block sidebar %}<!--菜单栏的内容 --> {% endblock %}

    步骤二:继承父模板

      {% extends "base.html" %}

    步骤三:填充新的内容(index.html)

      {% extends "base.html" %}

      {% block sidebar %}<!-- 新的菜单栏的内容 --> {% endblock %}

    步骤四:复用父模板的内容(可选)

      {% extends "base.html" %}

      {% block sidebar %}

      {{ super() }}

      <!-- 新的菜单栏的内容 --> 

      {% endblock %}

  包含实现

    步骤一:将可变的部分拆出来(footer.html)

      <footer>

      这是页脚公共的部分

      </footer>

    步骤二:将拆出来的部分包进来(index.html)

      {% extends "base.html" %}

      {% block content %}

      <!– 页面主要内容区域-->

      {# 公用的footer #}

      {% include "footer.html" %}

      {% endblock %}

    include标签

      示例

        {% include "footer.html" ignore missing %}

        ignore missing : 如果模板不存在,jinjia2会忽略这条语句        

        {% include "footer.html" ignore missing with context %}

        ignore missing with context : 不携带当前页面的上下文

        {% include "footer.html" ignore missing without context%}

        ignore missing without context : 携带当前页面的上下文

  代码的复用

    当前页面的代码复用:

    <title>{% block title %}{% endblock %}</title>

    <h1>{{self.title}</h1>

    {% block body %}{% endblock %}

2.1 消息闪现

  第一步:在视图中产生一个消息(提示/警告/错误)

    flash(msg_content, msg_type)

    参数msg_content: 消息内容

    参数msg_type: 消息类型

  第二步:在模板中展示消息

    get_flashed_messages(category_filter=["error"])

    参数category_filter:对产生的消息按类别查询

    <ul class=flashes>

      {% for category, message in get_flashed_messages(with_categories=true) %}

      <li class="{{ category }}">{{ message }}</li>

      {% endfor %} 

    </ul>

 

 

  

 

 

 

 

 

 

 

 

 

上一篇:idea中添加 .ignore忽略提交文件到Git


下一篇:android调用webservice接口获取信息