Bootstrap 4 & 5 的 Flask 项目助手。
项目描述
Bootstrap-Flask
Bootstrap-Flask 是一个为 Bootstrap 4 & 5 和 Flask 提供的 Jinja 宏集合。它帮助您更轻松地将 Flask 相关的数据和对象渲染为 Bootstrap 标记 HTML。
- 将 Flask-WTF/WTForms 表单对象渲染为 Bootstrap 表单。
- 将数据对象(字典或类对象)渲染为 Bootstrap 表格。
- 将 Flask-SQLAlchemy
Pagination
对象渲染为 Bootstrap 分页。 - 等等。
安装
$ pip install -U bootstrap-flask
示例
注册扩展
from flask import Flask
# To follow the naming rule of Flask extension, although
# this project's name is Bootstrap-Flask, the actual package
# installed is named `flask_bootstrap`.
from flask_bootstrap import Bootstrap5
app = Flask(__name__)
bootstrap = Bootstrap5(app)
假设您有一个类似于以下的 Flask-WTF 表单
class LoginForm(FlaskForm):
username = StringField('Username', validators=[DataRequired(), Length(1, 20)])
password = PasswordField('Password', validators=[DataRequired(), Length(8, 150)])
remember = BooleanField('Remember me')
submit = SubmitField()
现在使用 render_form
宏
{% from 'bootstrap5/form.html' import render_form %}
<html>
<head>
<!-- Bootstrap CSS -->
</head>
<body>
<h2>Login</h2>
{{ render_form(form) }}
<!-- Bootstrap JS -->
</body>
</html>
您将获得一个这样的表单,其中只有一行代码(即 {{ render_form(form) }}
)
当验证失败时,错误消息将以适当的样式渲染
阅读更多详细信息,请参阅 基本用法 文档。
实时演示
https://bootstrap-flask-example.azurewebsites.net/
捐赠
如果您觉得 Bootstrap-Flask 有用,请考虑今天捐赠。您的捐赠使 Bootstrap-Flask 能够维护和更新 Bootstrap。
链接
关于 Bootstrap 4 & 5 支持的说明
Bootstrap 5 支持是在 Bootstrap-Flask 2.0 版本中添加的。现在您可以使用不同 Bootstrap 主版本的独立扩展类。
对于 Bootstrap 4,使用 Bootstrap4
类
from flask_bootstrap import Bootstrap4
# ...
bootstrap = Bootstrap4(app)
并从模板路径 bootstrap4/
导入宏
{% from 'bootstrap4/form.html' import render_form %}
对于 Bootstrap 5,使用 Bootstrap5
类
from flask_bootstrap import Bootstrap5
# ...
bootstrap = Bootstrap5(app)
并从模板路径 bootstrap5/
导入宏
{% from 'bootstrap5/form.html' import render_form %}
自 2.0 版本以来,Bootstrap
类和 bootstrap/
模板路径已被弃用,将在 3.0 版本中删除。
从 Flask-Bootstrap 迁移
如果您来自 Flask-Bootstrap,请查看这篇教程,了解如何迁移到这个扩展。
贡献
有关设置开发环境和如何向 Bootstrap-Flask 贡献的指南,请参阅 开发文档 和 Flask 的 贡献指南。
许可
本项目采用 MIT 许可证(有关详细信息,请参阅 LICENSE
文件)。一些宏是 Flask-Bootstrap 的一部分,并在其 BSD 许可证条款下进行了修改。
项目详情
下载文件
下载适合您平台的文件。如果您不确定选择哪个,请了解有关 安装软件包 的更多信息。