一、使用页面模板
Flask使用Jinja2作为默认的模板引擎。Jinja2是一个现代的模板引擎,可以方便地生成HTML、XML或其他格式的文档。使用Jinja2模板引擎可以快速生成静态页面,提高开发效率。
在项目根目录下新建一个templates文件夹,这个文件夹存放我们的模板文件。然后在模板文件夹下新建一个HTML文件作为模板文件。
示例一:一个简单的模板
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>{{ title }}</title>
</head>
<body>
<h1>Hello, {{ name }}</h1>
</body>
</html>
然后在应用中加载这个模板:
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def hello():
return render_template('index.html', title='首页', name='Flask')
if __name__ == '__main__':
app.run()
在路由函数中使用render_template函数渲染模板,传递参数title和name。render_template函数的第一个参数是模板文件路径,{% %}和{{ }}这样的占位符会在渲染页面的时候被替换成相应的值。
启动应用之后,在浏览器中输入 http://127.0.0.1:5000 ,就可以看到渲染后的页面了。
示例二:一个包含for循环的模板
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>{{ title }}</title>
</head>
<body>
<h1>Hello, {{ name }}</h1>
<ul>
{% for item in items %}
<li>{{ item }}</li>
{% endfor %}
</ul>
</body>
</html>
修改路由函数:
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def hello():
items = ['Python', 'Flask', 'Jinja2']
return render_template('index.html', title='首页', name='Flask', items=items)
if __name__ == '__main__':
app.run()
在模板文件中使用for循环遍历items列表,生成一个有序列表。
访问首页,可以看到一个包含有序列表的页面。
二、使用Bootstrap
Bootstrap是Twitter推出的一个用于前端开发的框架,提供了丰富的CSS样式和JavaScript插件,使得开发人员可以快速构建优美、响应式的Web页面。在Flask应用中使用Bootstrap可以使开发工作变得更加高效。
通过CDN(内容分发网络)引入Bootstrap样式:
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>{{ title }}</title>
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container">
<h1>Hello, {{ name }}</h1>
<ul class="list-group">
{% for item in items %}
<li class="list-group-item">{{ item }}</li>
{% endfor %}
</ul>
</div>
</body>
</html>
修改路由函数:
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def hello():
items = ['Python', 'Flask', 'Jinja2']
return render_template('index.html', title='首页', name='Flask', items=items)
if __name__ == '__main__':
app.run()
使用Bootstrap的容器(container)和列表(list-group)样式渲染页面,使页面更美观。
启动应用后,在浏览器中打开 http://127.0.0.1:5000 ,你将看到一个使用Bootstrap样式的Flask页面。
本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:Python编程flask使用页面模版的方法 - Python技术站