zoukankan      html  css  js  c++  java
  • Flask之模板之宏、继承、包含

    3.5 宏、继承、包含

    类似于python中的函数,宏的作用就是在模板中重复利用代码,避免代码冗余。

    Jinja2支持宏,还可以导入宏,需要在多处重复使用的模板代码片段可以写入单独的文件,再包含在所有模板中,以避免重复。

    定义宏

    {% macro input() %}
      <input type="text"
             name="username"
             value=""
             size="30"/>
    {% endmacro %}

    调用宏

    {{ input() }}

    定义带参数的宏

    {% macro input(name,value='',type='text',size=20) %}
        <input type="{{ type }}"
               name="{{ name }}"
               value="{{ value }}"
               size="{{ size }}"/>
    {% endmacro %}

    调用宏,并传递参数

    {{ input(value='name',type='password',size=40)}}

    把宏单独抽取出来,封装成html文件,其它模板中导入使用

    文件名可以自定义macro.html

    {% macro function() %}
    
        <input type="text" name="username" placeholde="Username">
        <input type="password" name="password" placeholde="Password">
        <input type="submit">
    {% endmacro %}

    在其它模板文件中先导入,再调用

    {% import 'macro.html' as func %}
    {% func.function() %}

    模板继承:

    模板继承是为了重用模板中的公共内容。一般Web开发中,继承主要使用在网站的顶部菜单、底部。这些内容可以定义在父模板中,子模板直接继承,而不需要重复书写。

    {% block top %}``{% endblock %}标签定义的内容,相当于在父模板中挖个坑,当子模板继承父模板时,可以进行填充。

    子模板使用extends指令声明这个模板继承自哪?父模板中定义的块在子模板中被重新定义,在子模板中调用父模板的内容可以使用super()。

    父模板:base.html

      {% block top %}
        顶部菜单
      {% endblock top %}
    
      {% block content %}
      {% endblock content %}
    
      {% block bottom %}
        底部
      {% endblock bottom %}

    子模板:

      {% extends 'base.html' %}
      {% block content %}
       需要填充的内容
      {% endblock content %}
    • 模板继承使用时注意点:
      • 不支持多继承。
      • 为了便于阅读,在子模板中使用extends时,尽量写在模板的第一行。
      • 不能在一个模板文件中定义多个相同名字的block标签。
      • 当在页面中使用多个block标签时,建议给结束标签起个名字,当多个block嵌套时,阅读性更好。

    包含(Include)

    Jinja2模板中,除了宏和继承,还支持一种代码重用的功能,叫包含(Include)。它的功能是将另一个模板整个加载到当前模板中,并直接渲染。

    示例:

    include的使用

    {\% include 'hello.html' %}

    包含在使用时,如果包含的模板文件不存在时,程序会抛出TemplateNotFound异常,可以加上ignore missing关键字。如果包含的模板文件不存在,会忽略这条include语句。

    示例:

    include的使用加上关键字ignore missing

    {\% include 'hello.html' ignore missing %}

    • 宏、继承、包含:
      • 宏(Macro)、继承(Block)、包含(include)均能实现代码的复用。
      • 继承(Block)的本质是代码替换,一般用来实现多个页面中重复不变的区域。
      • 宏(Macro)的功能类似函数,可以传入参数,需要定义、调用。
      • 包含(include)是直接将目标模板文件整个渲染出来。
  • 相关阅读:
    记一份电网信息化建设企业信息分析平台规划
    2018年个人心灵历程记录
    OGG For Bigdata To Kafka同步问题处理
    Vue.js有赞商城(思路以及总结整理)
    汉诺塔-递归算法
    git合并分支
    js实现页面消息滚动效果
    chrome实现网页高清截屏(F12、shift+ctrl+p、capture)
    JS计算时间差
    Socket.io详解
  • 原文地址:https://www.cnblogs.com/alexzhang92/p/9545571.html
Copyright © 2011-2022 走看看