Flask中jinja2的继承实现方法及实例

在继承的使用上，我们最早接触的是父类和子类的继承。不过Flask框架中的继承要简单一些，只要有一个原文件，便可以对其进行继承和修改的操作了。在修改的内容方面，可以通过关键字来进行实现。下面我们就Flask中jinja2的继承的实现先进行理论的介绍，然后带来实例供大家练习。

1、说明

Jinja2中最强大的部分是模板继承。通过模板继承，我们可以创建一个基本(框架)文件，其他文件可以从中继承，然后再根据需要对其进行修改。

在jinja2的框架文件中，使用block关键字表示它包含的内容可以被修改。

2、实例

<!DOCTYPE html>
<html>
<head>
  {% block head %}
  <link rel="stylesheet" href="style.css" rel="external nofollow" />
  <title>{% block title %}{% endblock %} - My Webpage</title>
  {% endblock %}
</head>
<body>
<div id="content">{% block content %}{% endblock %}</div>
<div id="footer">
  {% block footer %}
  <script>This is javascript code </script>
  {% endblock %}
</div>
</body>
</html>

这里定义了四处 block，即：head，title，content，footer。那怎么进行继承和变量替换呢？注意看下面的文件

{% extend "base.html" %}    # 继承base.html文件
{% block title %} Dachenzi {% endblock %}  # 定制title部分的内容
{% block head %}
{
{ super() }}    # 用于获取原有的信息
<style type='text/css'>
.important { color: #FFFFFF }
</style>
{% endblock %}
# 其他不修改的原封不同的继承

实例扩展：

jinja2模板继承

父亲：

<!DOCTYPE html>
<html>
<head>
 <title>模板继承</title>
</head>
<body>
 <span>这是基模板</span>
 <div id="content">{% block content %}{% endblock %}</div>
</body>
</html>

用{% block content %}{% endblock %}包含jinja2的字模板块；

子：

<!DOCTYPE html>
<html>
<head>
 <title>模板继承</title>
</head>
<body>
 {% extend "jinja2_模板继承.html"%}
 {% block content %}
 <p class="importtant">我在子模板</p>
</body>
</html>

{% extends "jinja2_模板继承.html"%}标签是这里的关键，告诉模板引擎这个模板继承自另外一个模板。该标签必须是子模板的第一个标签，解释器会自动将父亲的内容复制到子模板中！

结果应该是这样：

<!DOCTYPE html>
<html>
<head>
 <title>模板继承</title>
</head>
<body>
 <span>这是基模板</span>
 <div id="content">
   <p class="importtant">我在子模板</p>
  </div>
</body>
</html>

到此这篇关于Flask中jinja2的继承实现方法及实例的文章就介绍到这了,更多相关Flask中jinja2的继承如何实现内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们！

赞 (0)

相关推荐

  • Flask中jinja2的继承实现方法及实例

    在继承的使用上,我们最早接触的是父类和子类的继承.不过Flask框架中的继承要简单一些,只要有一个原文件,便可以对其进行继承和修改的操作了.在修改的内容方面,可以通过关键字来进行实现.下面我们就Flask中jinja2的继承的实现先进行理论的介绍,然后带来实例供大家练习. 1.说明 Jinja2中最强大的部分是模板继承.通过模板继承,我们可以创建一个基本(框架)文件,其他文件可以从中继承,然后再根据需要对其进行修改. 在jinja2的框架文件中,使用block关键字表示它包含的内容可以被修改.

  • python和flask中返回JSON数据的方法

    在python中可以使用json将数据格式化为JSON格式: 1.将字典转换成JSON数据格式: s=['张三','年龄','姓名'] t={} t['data']=s return json.dumps(t,ensure_ascii=False) 2.将列表转换成JSON数据格式: s=['张三','年龄','姓名'] return json.dumps(s,ensure_ascii=False) 使用json转换的在前端显示的数据为JSON字符串. 使用flask的jsonify转换后,在前

  • python flask中静态文件的管理方法

    Web应用中大多会提供静态文件服务以便给用户更好的访问体验. 静态文件主要包含CSS样式文件,js脚本,图片和字体等. Flask也支持静态文件访问的,默认情况下只需在项目根目录下,创建名为static的目录,在应用中使用'/static'开头的路径就可以访问了.但是为了获得更好的处理能力,推荐使用Nginx 或者其他服务器管理静态文件. 不要直接在模板中写死静态文件路径,应该使用url_for生成路径. 例如: url_for('static',filename='style.css') 生成

  • Python Web框架Flask中使用新浪SAE云存储实例

    对于部署在新浪应用引擎SAE上的项目,使用新浪SAE云存储是不错的存储方案. 新浪SAE云存储仅能在SAE环境中正常使用,对它进行简单封装后,可以直接在Flask中使用,项目代码见GitHub上Flask-SaeStorage. 使用示例代码: 复制代码 代码如下: from flask import Flask from flask_saestorage import SaeStorage   SAE_ACCESS_KEY = 'SAE Access Key' SAE_SECRET_KEY =

  • JQuery中attr方法和removeAttr方法用法实例

    本文实例讲述了JQuery中attr方法和removeAttr方法用法.分享给大家供大家参考.具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"

  • C#中实现多继承的方法

    近日看到了一个贴子,就是在C#语言中,如何实现多继承的问题.相信涉猎c#不多的人(像我这样的菜鸟),一看就觉得很可笑,c#肯定是不能实现多继承的啊.都知道在c++中因为实现多继承会有很多的歧义问题,所以在c#中就把多继承给取消了,而用接口来实现!但是想想,如果是初学者肯定不会不会问这样的问题.肯定是个高手,然后就开始上网查资料!然后发现真的可以实现! 说起多继承,首先大家可以想想这个问题:你知道在C#中怎么实现多继承吗? 主流的答案无非2种. 答案一:用接口啊,一个类可以继承自多个接口的. 答案

  • js中的hasOwnProperty和isPrototypeOf方法使用实例

    hasOwnProperty:是用来判断一个对象是否有你给出名称的属性或对象.不过需要注意的是,此方法无法检查该对象的原型链中是否具有该属性,该属性必须是对象本身的一个成员. isPrototypeOf:是用来判断要检查其原型链的对象是否存在于指定对象实例中,是则返回true,否则返回false. 复制代码 代码如下: function siteAdmin(nickName,siteName){ this.nickName=nickName; this.siteName=siteName;}si

  • JavaScript中String对象的使用方法以及实例

    JavaScript中String对象的使用方法以及实例

    方法总览: 实例(js中字符串和字符串对象之间能够自由转换,字符串可以直接使用字符串对象的方法和属性):  var ss="孙士彬倪炜豪汤键倪炜豪"; document.write(ss.anchor("cc")+"<br>"); // 生成一段 HTML 代码:<a name="cc">孙士彬倪炜豪汤键倪炜豪</a> document.write(ss.link("https:/

  • 在Node.js中实现文件复制的方法和实例

    Node.js 本身并没有提供直接复制文件的 API,如果想用 Node.js 复制文件或目录,需要借助其他的 API 来实现.复制单个的文件可以直接用 readFile.writeFile,这样比较简便.如果是复制一个目录下的所有文件,目录下可能还包含了子目录,那么此时就需要用到更高级点的 API 了. 流 流是 Node.js 移动数据的方式,Node.js 中的流是可读/可写的,HTTP 和文件系统模块都有用到流.在文件系统中,使用流来读取文件的时候,对于一个大文件可能并不会一次性读取完,

  • Flask框架模板继承实现方法分析

    本文实例讲述了Flask框架模板继承实现方法.分享给大家供大家参考,具体如下: 在模板中,可能会遇到以下情况: 多个模板具有完全相同的顶部和底部内容 多个模板中具有相同的模板代码内容,但是内容中部分值不一样 多个模板中具有完全相同的 html 代码块内容 像遇到这种情况,可以使用 JinJa2 模板中的 继承 来进行实现 模板继承是为了重用模板中的公共内容.一般Web开发中,继承主要使用在网站的顶部菜单.底部.这些内容可以定义在父模板中,子模板直接继承,而不需要重复书写. 标签定义的内容 {%

随机推荐