Flask框架学习笔记之模板操作实例详解


Posted in Python onAugust 15, 2019

本文实例讲述了Flask框架学习笔记之模板操作。分享给大家供大家参考,具体如下:

flask的模板引擎是Jinja2。

引入模板的好处是增加程序的可读性和易维护性,从而不用将一堆html代码塞在视图函数中。

还是以hello world为例。最基础的调用模板修饰文本。

# 根网址
@app.route('/')
def index():
  # return render_template("index.html")
  # 可以给模板传入文本content修饰
  content = "Hello World!"
  return render_template("index.html", content = content)

index模板,用{{}}表示变量。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
  <!--<h1>Hello World!</h1>></!-->
  <h1>{{ content }}</h1>
</body>
</html>

Flask框架学习笔记之模板操作实例详解

这里定义一个类以传入变量。

class User(object):
  def __init__(self, user_id, user_name):
    self.user_id = user_id
    self.user_name = user_name

传参

# 通过调用类的实例方法给模板传递参数修饰
@app.route('/user')
def user_index():
  user = User(520, "loli")# user_id, user_name
  return render_template("user_index.html", user=user)

user_index模板,仅显示user_name。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
  <h1>Hello {{ user.user_name }}</h1>
</body>
</html>

Flask框架学习笔记之模板操作实例详解

在模板中实现if语句

# 在模板中使用if语句
@app.route('/query_user/<user_id>')
def query_user(user_id):
  user = None
  # 如果传入的id为520则调用实例
  if int(user_id) == 520:
    user = User(520, 'loli')

  return render_template("user_id.html", user=user)

user_id模板,用{% %}包裹if语句,若user不为None(也就是传入了name),则显示if下语句,否则显示else下语句。

最后一定要加上{% endif %}表示判断语句结束。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
  {% if user %}
    <h1>hello {{ user.user_name }}</h1>
  {% else %}
    <h1>no this user</h1>
  {% endif %}

</body>
</html>

Flask框架学习笔记之模板操作实例详解

Flask框架学习笔记之模板操作实例详解

在模板中使用for循环语句

@app.route('/users')
def user_list():
  users = []
  for i in range(1, 11):
    user = User(i, "loli" + str(i))
    users.append(user)# 将user添加到users
  return render_template("user_list.html", users = users)# 在模板中修饰users

user_list模板,同样的,for循环语句也要用{% %}包裹起来,需要用{% endfor %}表示for循环结束。这里传入id和name两个参数。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
  {% for user in users %}
    {{ user.user_id }} -- {{ user.user_name }}<br>
  {% endfor %}
</body>
</html>

Flask框架学习笔记之模板操作实例详解

模板的继承。模板继承的初衷也是为了代码更加简单,更易维护,将相同部分的代码提到一个基类模板,有点类似于类的继承。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
  <div>
    <h1>I love you {{ user.user_name }}</h1>
  </div>
  {% block content %}
  {% endblock %}
  <div>
    <h1>So much!</h1>
  </div>
</body>
</html>

用<div>圈起来的是不可变的父模板,可改动添加的部分在{% block content %}{% endblock %}之间。

子模版,用{% extends "父模板" %} 表示从父模板继承了代码。在{% block content %}{% endblock %}之间添加内容。

{% extends "base.html" %}
{% block content %}
  <h2>more than anyone</h2>
{% endblock %}
{% extends "base.html" %}
{% block content %}
  <h2>more than anything</h2>
{% endblock %}

调用

# 模板继承1
@app.route('/one')
def one_base():
  user = User(520, 'loli')
  return render_template("one_base.html", user=user)
# 模板继承2
@app.route('/two')
def two_base():
  user = User(520, 'loli')
  return render_template("two_base.html", user=user)

Flask框架学习笔记之模板操作实例详解

Flask框架学习笔记之模板操作实例详解

可以看到子模版继承了题头和尾部,中间为子模版添加的内容。

代码

#-*- coding:utf-8 -*-
from flask import Flask, render_template# 导入render_template以使用模板
# 定义一个models导入一个有id和name的类
from models import User

app = Flask(__name__)
# 根网址
@app.route('/')
def index():
  # return render_template("index.html")
  # 可以给模板传入文本content修饰
  content = "Hello World!"
  return render_template("index.html", content = content)
# 通过调用类的实例方法给模板传递参数修饰
@app.route('/user')
def user_index():
  user = User(520, "loli")
  return render_template("user_index.html", user=user)
# 在模板中使用if语句
@app.route('/query_user/<user_id>')
def query_user(user_id):
  user = None
  if int(user_id) == 520:
    user = User(520, 'loli')

  return render_template("user_id.html", user=user)
# 在模板中使用for循环语句
@app.route('/users')
def user_list():
  users = []
  for i in range(1, 11):
    user = User(i, "loli" + str(i))
    users.append(user)
  return render_template("user_list.html", users = users)
# 模板继承1
@app.route('/one')
def one_base():
  user = User(520, 'loli')
  return render_template("one_base.html", user=user)
# 模板继承2
@app.route('/two')
def two_base():
  user = User(520, 'loli')
  return render_template("two_base.html", user=user)

if __name__ == '__main__':
  app.run()

希望本文所述对大家基于flask框架的Python程序设计有所帮助。

Python 相关文章推荐
python使用Berkeley DB数据库实例
Sep 26 Python
Python、Javascript中的闭包比较
Feb 04 Python
python使用socket远程连接错误处理方法
Apr 29 Python
Python循环语句之break与continue的用法
Oct 14 Python
Pycharm学习教程(6) Pycharm作为Vim编辑器使用
May 03 Python
Python列表和元组的定义与使用操作示例
Jul 26 Python
python多进程控制学习小结
Oct 31 Python
解决python3 pika之连接断开的问题
Dec 18 Python
python爬虫增加访问量的方法
Aug 22 Python
Python GUI库PyQt5样式QSS子控件介绍
Feb 25 Python
深入分析python 排序
Aug 24 Python
用python绘制樱花树
Oct 09 Python
Flask框架学习笔记之消息提示与异常处理操作详解
Aug 15 #Python
python打造爬虫代理池过程解析
Aug 15 #Python
使用selenium和pyquery爬取京东商品列表过程解析
Aug 15 #Python
如何爬取通过ajax加载数据的网站
Aug 15 #Python
Python K最近邻从原理到实现的方法
Aug 15 #Python
Python数据可视化 pyecharts实现各种统计图表过程详解
Aug 15 #Python
浅谈Python 敏感词过滤的实现
Aug 15 #Python
You might like
关于PHP内存溢出问题的解决方法
2013/06/25 PHP
完美解决PHP中的Cannot modify header information 问题
2013/08/12 PHP
Yii视图CGridView列表用法实例分析
2016/07/12 PHP
一个级联菜单代码学习及removeClass与addClass的应用
2013/01/24 Javascript
基于jQuery实现表单提交验证
2014/11/24 Javascript
Javascript前端UI框架Kit使用指南之Kitjs简介
2014/11/28 Javascript
node.js中的fs.unlinkSync方法使用说明
2014/12/15 Javascript
浅谈angular.js中实现双向绑定的方法$watch $digest $apply
2015/10/14 Javascript
基于jquery实现表格无刷新分页
2016/01/07 Javascript
jQuery事件委托之Safari
2016/07/05 Javascript
JavaScript获取服务器端时间的方法
2016/11/29 Javascript
ES6新特性之数组、Math和扩展操作符用法示例
2017/04/01 Javascript
NodeJS父进程与子进程资源共享原理与实现方法
2018/03/16 NodeJs
vuex操作state对象的实例代码
2018/04/25 Javascript
NodeJS实现自定义流的方法
2018/08/01 NodeJs
记录一次开发微信网页分享的步骤
2019/05/07 Javascript
修改vue源码实现动态路由缓存的方法
2020/01/21 Javascript
vue实现折线图 可按时间查询
2020/08/21 Javascript
Angular短信模板校验代码
2020/09/23 Javascript
swiperjs实现导航与tab页的联动
2020/12/13 Javascript
Python抓取百度查询结果的方法
2015/07/08 Python
python计算圆周率pi的方法
2015/07/11 Python
Python Requests安装与简单运用
2016/04/07 Python
python GUI库图形界面开发之PyQt5窗口类QMainWindow详细使用方法
2020/02/26 Python
django xadmin中form_layout添加字段显示方式
2020/03/30 Python
PyCharm2020最新激活码+激活码补丁(亲测最新版PyCharm2020.2激活成功)
2020/11/25 Python
马来西亚户外装备商店:PTT Outdoor
2019/07/13 全球购物
银行转正自我鉴定
2014/09/29 职场文书
2014年幼儿园老师工作总结
2014/12/05 职场文书
长江三峡导游词
2015/01/31 职场文书
歼十出击观后感
2015/06/11 职场文书
物业保洁员管理制度
2015/08/05 职场文书
如何写好一份优秀的工作总结?
2019/06/21 职场文书
nginx安装以及配置的详细过程记录
2021/09/15 Servers
漫画「请问您今天要来点兔子吗?」最新杂志彩页公开
2022/03/24 日漫
VW、VH适配移动端的解决方案与常见问题
2023/05/21 HTML / CSS