flask第30篇——宏macro和import标签
宏是Jinja2特有的,像Django则没有这个。
先新建一个项目macroDemo:
然后在templates文件夹中新建index.html文件,并在代码中返回渲染后的文件:
然后回到index.html,现在假设我们要写一个登录的表单:
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>宏</title>
</head>
<body>
<table>
<tbody>
<tr>
<td>账号</td>
<td><input type="text" placeholder="请输入账号"></td>
</tr>
<tr>
<td>密码</td>
<td><input type="password" placeholder="请输入密码"></td>
</tr>
<tr>
<td></td>
<td><input type="submit" value="提交"></td>
</tr>
</tbody>
</table>
</body>
</html>
执行app.py文件,看到:
看一下刚才写的index.html文件,每个标签都传了如type,placeholder等属性,那么我们可不可以把相同的内容提取出来呢?答案当然是可以,这时候就要用到宏的概念。
定义宏
{% macro 名称() %}
代码块
{% endmacro %}
调用
{{ 宏名称() }}
代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>宏</title>
{% macro input() %}
<input type="text">
{% endmacro %}
</head>
<body>
<table>
<tbody>
<tr>
<td>账号</td>
<td>{{ input() }}</td>
</tr>
<tr>
<td>密码</td>
<td>{{ input() }}</td>
</tr>
<tr>
<td></td>
<td>{{ input() }}</td>
</tr>
</tbody>
</table>
</body>
</html>
保存一下,刷新页面看到:
也就是说代码已经生效了。其实可以把宏的名称()看成一个函数。
但是现在input标签中还有type、placeholder等属性,这个时候就需要给input()传参数了:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>宏</title>
{% macro input(type, name, placeholder, value) %}
<input type="{{ type }}", name="{{ name }}", placeholder="{{ placeholder }}", value="{{ value }}">
{% endmacro %}
</head>
<body>
<table>
<tbody>
<tr>
<td>账号</td>
<td>{{ input("text", "", "请输入账号", "") }}</td>
</tr>
<tr>
<td>密码</td>
<td>{{ input("text", "", "请输入密码", "") }}</td>
</tr>
<tr>
<td></td>
<td>{{ input("submit", "", "", "提交") }}</td>
</tr>
</tbody>
</table>
</body>
</html>
保存,然后看到页面:
当然,下面在传值的时候也可以用关键字参数进行传递,比如
{{ input(type="submit", name="", placeholder="", value="提交") }}
效果是一样的。
如果属性有默认值,那么也可以添加默认值:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>宏</title>
{% macro input(type='text', name='', placeholder='', value='') %}
<input type="{{ type }}", name="{{ name }}", placeholder="{{ placeholder }}", value="{{ value }}">
{% endmacro %}
</head>
<body>
<table>
<tbody>
<tr>
<td>账号</td>
<td>{{ input(placeholder="请输入账号") }}</td>
</tr>
<tr>
<td>密码</td>
<td>{{ input(placeholder="请输入密码") }}</td>
</tr>
<tr>
<td></td>
<td>{{ input(type="submit", value="提交") }}</td>
</tr>
</tbody>
</table>
</body>
</html>
需要注意的是如果给了默认值,那么传参的时候就必须用关键字参数进行传值了。
也可以将宏封装成一个包的形式,在需要使用的时候通过导入进行调用:
我们在template文件夹下新建文件夹macros专门存放宏文件,并在该文件夹中新建forms.html文件。将宏的定义从index.html文件中剪切出来,放到forms.html文件中:
{% macro input(type='text', name='', placeholder='', value='') %}
<input type="{{ type }}", name="{{ name }}", placeholder="{{ placeholder }}", value="{{ value }}">
{% endmacro %}
然后在index.html中只需要导入宏文件即可。导入方法:{% import 'macros/forms.html' as forms %}
注意,这里后面必须要as,也就是必须给导入的文件起个名字。
代码:
{% import 'macros/forms.html' as forms %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>宏</title>
</head>
<body>
<table>
<tbody>
<tr>
<td>账号</td>
<td>{{ forms.input(placeholder="请输入账号") }}</td>
</tr>
<tr>
<td>密码</td>
<td>{{ forms.input(placeholder="请输入密码") }}</td>
</tr>
<tr>
<td></td>
<td>{{ forms.input(type="submit", value="提交") }}</td>
</tr>
</tbody>
</table>
</body>
</html>
保存以后回到页面,可以看到效果不变。
现在forms.html文件中只有一个宏定义,如果是多个的时候,比如把froms.html改为:
{% macro input(type='text', name='', placeholder='', value='') %}
<input type="{{ type }}", name="{{ name }}", placeholder="{{ placeholder }}", value="{{ value }}">
{% endmacro %}
{% macro textarea(name="", cols="", rows="") %}
<textarea name="{{ name }}", cols="{{ cols }}", rows="{{ rows }}"></textarea>
{% endmacro %}
这时候在index.html导入就要用:{% from 'macros/forms.html' import input %}
或者{% from 'macros/forms.html' import input as input_field%}
代码:
{% from 'macros/forms.html' import input %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>宏</title>
</head>
<body>
<table>
<tbody>
<tr>
<td>账号</td>
<td>{{ input(placeholder="请输入账号") }}</td>
</tr>
<tr>
<td>密码</td>
<td>{{ input(placeholder="请输入密码") }}</td>
</tr>
<tr>
<td></td>
<td>{{ input(type="submit", value="提交") }}</td>
</tr>
</tbody>
</table>
</body>
</html>
执行以后页面显示效果不变。如果现在要把两个宏都导入,那就只需要:
{% from 'macros/forms.html' import input, textarea %}
或者{% from 'macros/forms.html' import input as input_field, textarea%}
如果用下面这种方式,就要把input as input_field看做一个整体。
flask第30篇——宏macro和import标签的更多相关文章
- Flask基础(15)-->模板代码的复用【宏(Macro)、继承(Block)、包含(include)】
宏 对宏(macro)的理解: 把它看作 Jinja2 中的一个函数,它会返回一个模板或者 HTML 字符串 为了避免反复地编写同样的模板代码,出现代码冗余,可以把他们写成函数以进行重用 需要在多处重 ...
- Flask最强攻略 - 跟DragonFire学Flask - 第四篇 Flask 中的模板语言 Jinja2 及 render_template 的深度用法
是时候开始写个前端了,Flask中默认的模板语言是Jinja2 现在我们来一步一步的学习一下 Jinja2 捎带手把 render_template 中留下的疑问解决一下 首先我们要在后端定义几个字符 ...
- flask 第四篇 模板语言jinja2
是时候开始写个前端了,Flask中默认的模板语言是Jinja2 现在我们来一步一步的学习一下 Jinja2 捎带手把 render_template 中留下的疑问解决一下 首先我们要在后端定义几个字符 ...
- Flask jinja2 全局函数,宏
内置全局函数 dict()函数,方便生成字典型变量 {% set user = dict(name='Mike',age=15) %} <p>{{ user | tojson | safe ...
- Flask之模板之宏、继承、包含
3.5 宏.继承.包含 类似于python中的函数,宏的作用就是在模板中重复利用代码,避免代码冗余. Jinja2支持宏,还可以导入宏,需要在多处重复使用的模板代码片段可以写入单独的文件,再包含在所有 ...
- [易学易懂系列|rustlang语言|零基础|快速入门|(22)|宏Macro]
[易学易懂系列|rustlang语言|零基础|快速入门|(22)|宏Macro] 实用知识 宏Macro 我们今天来讲讲Rust中强大的宏Macro. Rust的宏macro是实现元编程的强大工具. ...
- C语言的宏macro的使用
C's Macro Introduction 1.The Connect Macros: ## 这是一个预处理连接符,这个操作符主要用来将两个符号连接成为一个完整的宏符号.通过下面的代码,可以看到其具 ...
- Templates中的macro和include标签
1.macro标签 1.作用:相当于在模板中声名函数 2.使用方法: 语法:{% macro 名称(参数列表) %} xxx {% endmacro %} 创建 macro.html 模板文件 - ...
- FreeMarker中<#include>和<#import>标签的区别
在使用freemarker作为前端页面模板的应用中,会有很多的freemarker模板页面,这些ftl会在不同的页面中重复使用,一是为了简化布局的管理,二是可以重复使用一些代码. 在freemarke ...
随机推荐
- Mr. Kitayuta vs. Bamboos CodeForces - 505E (堆,二分答案)
大意: 给定$n$棵竹子, 每棵竹子初始$h_i$, 每天结束时长$a_i$, 共$m$天, 每天可以任选$k$棵竹子砍掉$p$, 若不足$p$则变为0, 求$m$天中竹子最大值的最小值 先二分答案转 ...
- ubuntu vim简单命令
1.ubuntu vim 一些基本的命令. :set nu 或着 set number 设置行数 :set nonu 取消行数 ctrl+u 将 ...
- c语言枚举类型变量的作用
#include<stdio.h> enum DAY { MON=, TUE, WED, THU, FRI, SAT, SUN }; int main() { enum DAY day; ...
- spring boot 学习(九)小工具篇:?秒防刷新
注解 + 拦截器:?秒防刷新 小工具篇:工具许多都是我以前在 github 之类开源平台找到的小工具类,作者的信息什么的许多都忘了.先说声不好意思了.若有相关信息,麻烦提醒一下~ 解释 所谓的?秒防刷 ...
- jsp javabean开发模式
JSP&&JavaBean开发模式 在jsp+javabean架构中,jsp负责控制逻辑,表现逻辑,业务对象的调用 jsp+javaBean模式适合开发业务逻辑不复杂的web应用,这种 ...
- css 初始包含块
continuous media ,paged media 关于continuous media[连续媒体]和paged media[分页媒体] 直白的讲,continuous和paged media ...
- 玩转X-CTR100 | STM32F4 l Malloc内存管理
我造轮子,你造车,创客一起造起来!塔克创新资讯[塔克社区 www.xtark.cn ][塔克博客 www.cnblogs.com/xtark/ ] 内存管理技术,即内存的申请和释放,使用X- ...
- SharePoint 2013的100个新功能之内容管理(四)
一:脚本编辑器Web部件 新的脚本编辑器Web部件表现为插入标签页下的Ribbon中的"嵌入的代码",可以使用户在SharePoint网站页面中添加HTML或Javascript或 ...
- Hashtable实现原理及源码分析
Hashtable简介 和HashMap一样,Hashtable也是一个散列表,存储的内容是键值对(key-value)映射. Hashtable在Java中的定义为: public class Ha ...
- Mitmproxy介绍及Python拦截代理
使用 mitmproxy + python 做拦截代理 转自:https://blog.wolfogre.com/posts/usage-of-mitmproxy/ 本文是一个较为完整的 mitm ...