一、宏 macro
概述:
类似python中的函数
主体机构
{% macro 名称([参数]...) %}
...
{% endmacro %}
调用:
{{ 宏名称([参数...]) }}
制作一个表单宏
{% macro form(con='',type='text',name='',value='') %}
<p>{{ con }} <input type="{{ type }}" name='{{ name }}' value="{{ value }}"></p>
{% endmacro %}
<form action="">
{{ form('用户名:',name='username') }}
{{ form('密码:','text','userpass') }}
{{ form(type='submit',value='submit') }}
</form>
导入:
(1) from … import …
{% from 'common/testmacro.html' import form %}
{{ form('密码:','text','userpass') }}
(2) from … import … as …
{% from 'common/testmacro.html' import form as form%}
{{ form('密码:','text','userpass') }}
(3) import … as …
{% import 'common/testmacro.html' as testmacro %}
{{ testmacro.form('用户名:',name='username') }}
注意:
- 宏的调用只能在下方调用
- 如果函数有形参则没有实参 则不传第不报错
- 定义宏的参数时候 形参默认值遵循默认值的规则 幽默认值的放后面
- 关键字参数的使用和 python的函数一样 如果第一个参数使用关键字 后面都要使用关键字 如果第一个没有使用关键字 后面关键字可有可无
二、过滤器
概述
就是python中的函数 在值输出之前 对其进行过滤在输出
-
abs 绝对值
-
default 默认值 默认情况下 当变量不存在则执行默认值
{{ var|default(‘默认值’) }}
{{ var|default(‘默认值’,boolean=True) }} 变量不存在和bool的假都执行默认值
-
first 第一个值
-
last 最后一个值
-
format
{{ “我叫%s 我今年%d岁了 我的存款是%.2f元 我的格言是%s”|format(‘学委’,28,2222,‘放荡不鸡爱学习’) }}
-
length 长度
-
join 拼凑成字符串
-
safe 安全的 不转义html代码
-
int 整形
-
float 浮点形
-
string 字符串
-
list 列表
-
lower 小写
-
upper 大写
-
replace 替换
-
striptags 去除html标签
自定义过滤器
需求:
我的文章内容在首页展示的时候 一旦超出了某个长度以后 显示为 …
实例
方法一
@app.template_filter()
def showEllipsis(Str,length=20):
if len(Str) > length:
Str = Str[:length]+'...'
return Str
方法二
def showEllipsis(Str,length=20):
if len(Str) > length:
Str = Str[:length]+'...'
return Str
#添加过滤器
app.add_template_filter(showEllipsis)
在模板中使用
<li>{{ Str|showEllipsis(30) }}</li>
三、视图函数传递多个参数
(1) 普通传参
@app.route('/')
def index():
return render_template('index.html',title='首页'...)
(2) 使用字典
@app.route('/')
def index():
return render_template('index.html',con={'title':'首页'...})
return render_template('index.html',**{'title':'首页'...})
(3) 使用locals函数
@app.route('/test_filter/')
def test_filter():
title = '标题'
con = '内容'
# print(locals())
return render_template('testfilter.html',**locals())
(4) 使用全局变量g
from flask import g
@app.route('/test_filter/')
def test_filter():
g.title = '标题'
g.con = '内容'
return render_template('testfilter.html')
使用
g.title
g.con
四、静态资源加载
什么是静态资源:
css、js、images
目录结构
project/
templates/
static/
img/
css/
js/
upload/
manage.py
变量
{{ url_for(‘static’,filename=‘路径/文件名.后缀’,_external=True) }}
实例:
<img src="{{ url_for('static',filename='img/timg.jpeg',_external=True) }}" alt="">
Flask表单
一、原生表单
(1) 视图函数
#允许post提交
@form.route('/do_form/',methods=['GET','POST'])
def do_form():
if request.method == 'POST':
print(request.form)
print(request.form.get('username'))
print(request.form.get('userpass'))
return '数据提交过来了'
return render_template('form.html')
(2) html代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h2>表单</h2>
<form action="{{ url_for('form.do_form') }}" method="post">
<p>用户名: <input type="text" name="username"></p>
<p>密码: <input type="password" name="userpass"></p>
<p><input type="submit" value="submit"></p>
</form>
</body>
</html>
二、Flask-wtf扩展库
概述:
是一个用于处理表单的扩展库 提供了表单校验 csrf等功能
安装:
pip3 install flask-wtf
常见字段类型
字段类型 | 说明 |
---|---|
StringField | 普通文本字段 |
SubmitField | 提交按钮 |
PasswordField | 密码框 |
HiddenField | 隐藏域 |
TextAreaField | 多行文本域 |
DateField | 日期 |
DateTimeField | 日期和时间 |
IntegerField | 整形 |
FloatField | 浮点形 |
BooleanFIeld | 布尔形 |
RadioField | 单选 |
SelectField | 下拉 |
FileField | 文件上传 |
常见表单验证器
验证器 | 说明 |
---|---|
DateRequired | 必填 |
验证邮箱 | |
URL | 验证url地址 |
IPAddress | 验证IP地址 |
Length | 长度限制 min 和max |
NumberRange | 值的范围 min 和 max |
EqualTo | 验证俩个字段的值是否相同 |
Regexp | 正则匹配 |
注册类
from flask import Flask,render_template,request
from flask_script import Manager
from flask_bootstrap import Bootstrap
from flask_wtf import FlaskForm #导入表单基类
from wtforms import StringField,PasswordField,SubmitField #导入字段
from wtforms.validators import DataRequired,Email,Length,EqualTo #导入验证器
app = Flask(__name__)
app.config['SECRET_KEY'] = 'asd271basx.a2'
bootstrap = Bootstrap(app)
manager = Manager(app)
# 自定义表单类
class Register(FlaskForm):
#name名 = 文本类型 text 参数1:为label 验证器:部位空 值的长度范围限制
username = StringField('用户名',validators=[DataRequired('用户名不能为空!'),Length(min=6,max=12,message='用户名为6~12位之间')])
userpass = PasswordField('密码',validators=[DataRequired('密码不能为空!'),Length(min=6,max=12,message='密码在6~12位之间')])
confirm = PasswordField('确认密码',validators=[DataRequired('确认密码不能为空!'),Length(min=6,max=12,message='确认密码在6~12位之间'),EqualTo('userpass',message='密码和确认密码不一致!')])
email = StringField('邮箱',validators=[DataRequired('邮箱不能为空!'),Email(message='请输入正确的邮箱地址')])
submit = SubmitField('注册')
@app.route('/register/',methods=['GET','POST'])
def register():
form = Register() #实例化表单类
#csrf和表单验证器都通过了则为真
if form.validate_on_submit():
print(form.username.data)
print(form.userpass.data)
print(request.form)
return '数据提交'
return render_template('register.html',form=form)
register.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h2>注册类</h2>
<form action="" method="post">
{{ form.csrf_token }}
{# 取出label标签 也就是你的用户名 #}
{{ form.username.label() }}
{# 取出文本标签 #}
{{ form.username() }}
{# 循环显示错误信息 #}
{% for err in form.username.errors %}
<span style="color: red;">{{ err }}</span>
{% endfor %}
<br>
{{ form.userpass.label() }}
{{ form.userpass() }}
{# 循环显示错误信息 #}
{% for err in form.userpass.errors %}
<span style="color: red;">{{ err }}</span>
{% endfor %}
<br>
{{ form.confirm.label() }}
{{ form.confirm() }}
{# 循环显示错误信息 #}
{% for err in form.confirm.errors %}
<span style="color: red;">{{ err }}</span>
{% endfor %}
<br>
{{ form.email.label() }}
{{ form.email() }}
{# 循环显示错误信息 #}
{% for err in form.email.errors %}
<span style="color: red;">{{ err }}</span>
{% endfor %}
<br>
{{ form.submit() }}
</form>
</body>
</html>
用封装宏来渲染
{% macro formMacro(formfield) %}
<tr>
<td>{{ formfield.label() }}</td>
<td>{{ formfield() }}</td>
<td>
{% for err in formfield.errors %}
<span>{{ err }}</span>
{% endfor %}
</td>
</tr>
{% endmacro %}
<table>
<form action="" method="post">
{{ form.csrf_token }}
{{ formMacro(form.username) }}
{{ formMacro(form.userpass) }}
{{ formMacro(form.confirm) }}
{{ formMacro(form.email) }}
<tr>
<td>{{ form.submit() }}</td>
</tr>
</form>
</table>
自定义表单验证器
# 自定义表单验证器 验证username字段的值
def validate_username(self,field):
# print(field.data)
# print(self.username.data)
if field.data == 'zhangsan':
raise ValidationError('该用户已存在 请重新输入')
取出表单传递过来的值
- request.form
- form.属性名.data
使用bootstrap快速渲染表单
{% extends 'common/base.html' %}
{% block pagecontent %}
{% from 'bootstrap/wtf.html' import quick_form %}
<div class="row">
<div class="col-md-8">.col-md-8</div>
<div class="col-md-4">{{ quick_form(form) }}</div>
</div>
{% endblock %}
注意:
想要给字段添加额外的属性和值 render_kw
#name名 = 文本类型 text 参数1:为label 验证器:部位空 值的长度范围限制
username = StringField('用户名',validators=[DataRequired('用户名不能为空!'),Length(min=6,max=12,message='用户名为6~12位之间')],render_kw={'placeholder':'请输入用户名','minlength':6,'maxlength':12,'style':'color:red;'})