当前位置: 首页 > news >正文

Flask狼书笔记 | 03_模板

请添加图片描述

文章目录

  • 3 模板
    • 3.1 模板基本使用
    • 3.2 模板结构组织
    • 3.3 模板进阶


3 模板

模板(template):包含固定内容和动态部分的可重用文件。Jinja2模板引擎可用于任何纯文本文件。

3.1 模板基本使用

HTML实体:https://dev.w3.org/html5/html-author/charref

Jinja2定界符

  • 语句:{% ... %}
  • 表达式:{{ ... }}
  • 注释:{# ... #}

:适度使用模板,仅放和输出控制有关的逻辑操作。

补充render_template()中,也可以传入python函数,并在模板中调用。

上下文

  • 在模板中定义变量:使用set标签。(p80)
  • 内置上下文变量:config,request,session,g。
  • 自定义上下文@app.context_processor ,等(p81)

全局对象

  • Flask内置模板全局函数url_for()用于生产URL,get_flashed_messages()用于获取flask消息。

自定义全局函数@app.template_global()装饰器

过滤器修改过滤变量值的特殊函数。

{{ name|title }}
{% filter upper %}This itext becomes upperase.
{% endfilter %}

Jinja2常用内置过滤器(p83)

  • 自定义过滤器@app.emplate_filter()

测试器:测试变量或表达式,返回布尔值 ,使用@app.template_test()自定义。

{% if foo is sameas(bar) %}...

模板环境对象:控制渲染行为,包含配置选项、上下文变量、全局函数(globals)、过滤器(filters)、测试器(tests),在app.jinja_env属性。

# 添加自定义全局对象 
def bar():return 'I am bar.'app.jinja_env.globals['bar'] = bar

3.2 模板结构组织

局部模板:减少代码重复。在ajax请求中可以只返回一个局部模板,而不是整个页面。

{% include '_banner.html' %}

:(macro)类似函数,也为了代码重用。

  • 注意include会自动传递上下文;而import不会,需要显示传递。
{% from 'macros.html' import qux with context%}
...
{{ qux(amount=5) }}

模板继承:在基模板中定义基本的HTML结构,而子模板只需要对特定的块进行修改(覆盖或追加{{ super() }})。(p90)

{% extends 'base.html' %}
{% block content %}
...
{% endblock content %}

3.3 模板进阶

空白控制:模板中的Jinja2语句会保留移除后的空行,但不影响浏览器的解析。可以使用工具去除空白,减小文件体积,提高数据传输速度。

{%- endif %}

加载静态文件:默认存放在主脚本同级目录的static文件夹中,使用url_for()函数获取。Flask内置了用于获取静态文件的视图函数,端点值为static

{{ url_for('static', filename='avatar.jpg') }}
  • Favicon:浏览器在标签页、地址栏、收藏夹等处显示的小图标。(p96)
  • CDN加载静态资源更方便
  • 可以创建一个专门用于加载静态资源的

疑惑:对favicon的请求是自动的吗,所有项目都有?

消息闪现:在视图函数调用flash()函数,你的消息将存储在session中,然后再模板中使用全局函数get_flashed_messages()获取消息并显示,调用后会清空session中的消息。

{% for message in get_flashed_messages() %}{{ message }}
{% endfor %}
  • 文本字符串编码问题:(p98)

自定义错误页面:默认的简陋错误页面往往另用户不知所措,我们可以注册错误处理函数来自定义错误页面。

@app.errorhandler(404)
def page_not_found(e):return render_template('errors/404.html'), 404

JavaScript和CSS中的Jinja:有时需要再JavaScript或CSS代码中使用Jinja2提供的变量,如我们希望将用户设置的主题颜色设置到对应的CSS规则中。

  • 只有使用render_template()传入的模板文件才会被渲染,而在javascript、css文件中引入的Jinja2代码不会被执行。(?)

  • 1、嵌入式Javascript/CSS:在模板文件中,使用<style><script>标签定义这部分代码。

  • 2、定义为Javascript/CSS变量

{# 定义JavaScript变量 #}
<script type="text/javascript">var foo = '{{ foo_variable }}';
</script>{# 定义CSS变量 #}
<sytle>
:root {--theme-color: {{ theme_color }};
}

相关文章:

Flask狼书笔记 | 03_模板

文章目录 3 模板3.1 模板基本使用3.2 模板结构组织3.3 模板进阶 3 模板 模板&#xff08;template&#xff09;&#xff1a;包含固定内容和动态部分的可重用文件。Jinja2模板引擎可用于任何纯文本文件。 3.1 模板基本使用 HTML实体&#xff1a;https://dev.w3.org/html5/htm…...

MySQL 数据备份和数据恢复

目录 一、数据备份 1、概述 2、MySQLdump命令备份 1&#xff09;备份单个数据库中的所有表 2) 备份数据中某个或多个表 3) 备份所有数据库 4&#xff09;备份多个库 5) 只备份一个表或多个表结构 二、数据恢复 三、数据备份与恢复应用 一、数据备份 1、概述 数据备…...

软考高级系统架构设计师系列论文八十二:论软件的可维护性设计

软考高级系统架构设计师系列论文八十二:论软件的可维护性设计 一、摘要二、正文三、总结一、摘要 随着软件大型化,复杂化的发展,软件维护所耗费的资源越来越多,软件可维护性设计日益得到重视。我单位近几年开发综合业务 ATM交换机,用户对交换机的可维护性要求很高。我参加…...

Ompl初探

在/ompl-1.x.0/build/Release/bin下有很多生成的demo可执行文件 在终端执行 ./demo_Point2DPlanning 测试程序 #include <ompl/base/SpaceInformation.h> #include <ompl/base/spaces/SE3StateSpace.h> #include <ompl/base/StateSpace.h> #include <o…...

android sdk打包aar方案步骤

1.使用fat-aar库https://github.com/kezong/fat-aar-android/blob/master/README_CN.md 第一步&#xff1a;添加以下代码到你工程根目录下的build.gradle文件中: For Maven Central (The lastest release is available on Maven Central): buildscript {repositories {maven…...

Redis之bitmap类型解读

目录 基本介绍 基本命令 Setbit Getbit BITCOUNT 应用场景 统计当日活跃用户 用户签到 bitmap - Redis布隆过滤器 &#xff08;应对缓存穿透问题&#xff09; 基本介绍 Redis 的位图&#xff08;bitmap&#xff09;是由多个二进制位组成的数组&#xff0c;只有两…...

stm32之10.系统定时器

delay_s()延时秒 delay_ms()毫秒*1000 delay_us()微秒*1000000 微秒定时器代码 void delay_us(uint32_t n) { SysTick->CTRL 0; // Disable SysTick&#xff0c;关闭系统定时器 SysTick->LOAD SystemCoreClock/1000000*n-1; // 就是nus SysTick->LOAD Sys…...

PyTorch安装教程:从头开始配置PyTorch环境

PyTorch是一个开源的机器学习框架&#xff0c;广泛用于深度学习任务。要开始使用PyTorch&#xff0c;您需要在计算机上正确配置PyTorch环境。本文将为您提供一步步的指南&#xff0c;帮助您成功安装和配置PyTorch。 第一部分&#xff1a;安装Python和相关工具 第一步&#xf…...

Docker拉取并配置Grafana

Linux下安装Docker请参考&#xff1a;Linux安装Docker 安装准备 新建挂载目录 /opt/grafana/data目录&#xff0c;准备用来挂载放置grafana的数据 /opt/grafana/plugins目录&#xff0c;准备用来放置grafana的插件 /opt/grafana/config目录&#xff0c;准备用来挂载放置graf…...

Vue+Axios搭建二次元动态登录页面(mp4视频格式)

最近想做一个前端登录页面&#xff0c;背景好看的&#xff0c;格式中规中矩的&#xff0c;这么难&#xff1f;我自己创一个吧&#xff01; 效果图如下&#xff1a; 源码可以参考我的github&#xff0c;复制源码即可用&#xff1a;gym02/loginPage_Vue: 使用VueAxios搭建的动态…...

【Kubernetes】K8S到底是什么,最近怎么这么火

前言 kubernetes&#xff0c;简称K8s&#xff0c;是用8代替名字中间的8个字符“ubernete”而成的缩写。是一个开源的&#xff0c;用于管理云平台中多个主机上的容器化的应用&#xff0c;Kubernetes的目标是让部署容器化的应用简单并且高效&#xff08;powerful&#xff09;,Kub…...

Java爬虫下载网页图片

在Java中&#xff0c;可以使用HttpURLConnection&#xff0c;Jsoup等库来实现网页爬取和图片下载。下面是一个基本的例子&#xff1a; 首先&#xff0c;需要添加Jsoup库到你的项目中。如果你使用Maven&#xff0c;可以在你的pom.xml文件中添加以下依赖&#xff1a; xml <…...

C语言之扫雷游戏实现篇

目录 主函数test.c 菜单函数 选择循环 扫雷游戏实现分析 整体思路 问题1 问题2 问题3 问题4 游戏函数&#xff08;函数调用&#xff09; 创建游戏盘数组mine 创建游戏盘数组show 初始化游戏盘数组InitBoard 展示游戏盘DisplayBoard 游戏盘置雷SetMine 游戏…...

Python面向对象中super用法与MRO机制

Python面向对象中super用法与MRO机制 最近再看trackformer&#xff0c;里面用到了super的用法&#xff0c;记录一下super的用法 class A(object):def __init__(self):print(init A)def fun(self):print(A.fun)print(self)super(A, self).fun()class B(object):def __init__(s…...

高性能网络模式-Reactor

事实上&#xff0c;Reactor 模式也叫Dispatcher模式&#xff0c;即I/O 多路复⽤监听事件&#xff0c;收到事件后&#xff0c;根据事件类型分配&#xff08;Dispatch&#xff09;给某个进程/线程。Reactor 模式也是一种非阻塞同步网络模式。 Reactor 模式主要由 Reactor部分和处…...

gRpc的四种通信方式详细介绍

&#x1f337;&#x1f341; 博主猫头虎 带您 Go to New World.✨&#x1f341; &#x1f984; 博客首页——猫头虎的博客&#x1f390; &#x1f433;《面试题大全专栏》 文章图文并茂&#x1f995;生动形象&#x1f996;简单易学&#xff01;欢迎大家来踩踩~&#x1f33a; &a…...

JWT令牌的介绍

目录 一、什么是JWT 二、JWT令牌和Cookie客户端、Session服务端对比 三、特点与注意事项 四、使用场景 优点&#xff1a; 五、结构组成 一、什么是JWT JWT&#xff08;JSON Web Token&#xff09;是一种用于在网络应用间传递信息的开放标准&#xff08;RFC 7519&#x…...

C语言入门 Day_9 条件判断

目录 前言&#xff1a; 1.if判断 2.else判断 3.易错点 4.思维导图 前言&#xff1a; 我们知道比较运算和逻辑运算都会得到一个布尔型的数据&#xff0c;要么为真&#xff08;true&#xff09;&#xff0c;要么为假&#xff08;false&#xff09;。 今天我们来学习真和假在…...

Nodejs-nrm:快速切换npm源 / npm官方源和其他自定义源之间切换

一、理解 Nodejs nrm Nodejs nrm 是一个管理 npm 源的工具。由于 npm 在国内的速度较慢&#xff0c;很多开发者会使用淘宝的 npm 镜像源&#xff0c;但是也会遇到一些问题&#xff0c;例如某些包在淘宝镜像源中不存在&#xff0c;或者淘宝镜像源本身也会有问题。 Nodejs nrm …...

数据驱动洞察:各种词频分析技术挖掘热点数据

一、引言 随着信息时代的发展&#xff0c;人们的关注点日益复杂多样。社交媒体、新闻网站和论坛等平台上涌现了大量的信息&#xff0c;这使得热点分析成为了解社会热点话题和舆情动向的重要手段。词频统计是热点分析的基础&#xff0c;本文将分别介绍基于ElasticSearch、基于S…...

Android Wi-Fi 连接失败日志分析

1. Android wifi 关键日志总结 (1) Wi-Fi 断开 (CTRL-EVENT-DISCONNECTED reason3) 日志相关部分&#xff1a; 06-05 10:48:40.987 943 943 I wpa_supplicant: wlan0: CTRL-EVENT-DISCONNECTED bssid44:9b:c1:57:a8:90 reason3 locally_generated1解析&#xff1a; CTR…...

解锁数据库简洁之道:FastAPI与SQLModel实战指南

在构建现代Web应用程序时&#xff0c;与数据库的交互无疑是核心环节。虽然传统的数据库操作方式&#xff08;如直接编写SQL语句与psycopg2交互&#xff09;赋予了我们精细的控制权&#xff0c;但在面对日益复杂的业务逻辑和快速迭代的需求时&#xff0c;这种方式的开发效率和可…...

电脑插入多块移动硬盘后经常出现卡顿和蓝屏

当电脑在插入多块移动硬盘后频繁出现卡顿和蓝屏问题时&#xff0c;可能涉及硬件资源冲突、驱动兼容性、供电不足或系统设置等多方面原因。以下是逐步排查和解决方案&#xff1a; 1. 检查电源供电问题 问题原因&#xff1a;多块移动硬盘同时运行可能导致USB接口供电不足&#x…...

BCS 2025|百度副总裁陈洋:智能体在安全领域的应用实践

6月5日&#xff0c;2025全球数字经济大会数字安全主论坛暨北京网络安全大会在国家会议中心隆重开幕。百度副总裁陈洋受邀出席&#xff0c;并作《智能体在安全领域的应用实践》主题演讲&#xff0c;分享了在智能体在安全领域的突破性实践。他指出&#xff0c;百度通过将安全能力…...

深入解析C++中的extern关键字:跨文件共享变量与函数的终极指南

&#x1f680; C extern 关键字深度解析&#xff1a;跨文件编程的终极指南 &#x1f4c5; 更新时间&#xff1a;2025年6月5日 &#x1f3f7;️ 标签&#xff1a;C | extern关键字 | 多文件编程 | 链接与声明 | 现代C 文章目录 前言&#x1f525;一、extern 是什么&#xff1f;&…...

图表类系列各种样式PPT模版分享

图标图表系列PPT模版&#xff0c;柱状图PPT模版&#xff0c;线状图PPT模版&#xff0c;折线图PPT模版&#xff0c;饼状图PPT模版&#xff0c;雷达图PPT模版&#xff0c;树状图PPT模版 图表类系列各种样式PPT模版分享&#xff1a;图表系列PPT模板https://pan.quark.cn/s/20d40aa…...

初探Service服务发现机制

1.Service简介 Service是将运行在一组Pod上的应用程序发布为网络服务的抽象方法。 主要功能&#xff1a;服务发现和负载均衡。 Service类型的包括ClusterIP类型、NodePort类型、LoadBalancer类型、ExternalName类型 2.Endpoints简介 Endpoints是一种Kubernetes资源&#xf…...

windows系统MySQL安装文档

概览&#xff1a;本文讨论了MySQL的安装、使用过程中涉及的解压、配置、初始化、注册服务、启动、修改密码、登录、退出以及卸载等相关内容&#xff0c;为学习者提供全面的操作指导。关键要点包括&#xff1a; 解压 &#xff1a;下载完成后解压压缩包&#xff0c;得到MySQL 8.…...

AI语音助手的Python实现

引言 语音助手(如小爱同学、Siri)通过语音识别、自然语言处理(NLP)和语音合成技术,为用户提供直观、高效的交互体验。随着人工智能的普及,Python开发者可以利用开源库和AI模型,快速构建自定义语音助手。本文由浅入深,详细介绍如何使用Python开发AI语音助手,涵盖基础功…...

uniapp 集成腾讯云 IM 富媒体消息(地理位置/文件)

UniApp 集成腾讯云 IM 富媒体消息全攻略&#xff08;地理位置/文件&#xff09; 一、功能实现原理 腾讯云 IM 通过 消息扩展机制 支持富媒体类型&#xff0c;核心实现方式&#xff1a; 标准消息类型&#xff1a;直接使用 SDK 内置类型&#xff08;文件、图片等&#xff09;自…...