溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

如何在Flask中實現(xiàn)jinja2的繼承

發(fā)布時間:2021-03-03 17:30:40 來源:億速云 閱讀:182 作者:Leah 欄目:開發(fā)技術

如何在Flask中實現(xiàn)jinja2的繼承?相信很多沒有經(jīng)驗的人對此束手無策,為此本文總結了問題出現(xiàn)的原因和解決方法,通過這篇文章希望你能解決這個問題。

1、說明

Jinja2中最強大的部分是模板繼承。通過模板繼承,我們可以創(chuàng)建一個基本(框架)文件,其他文件可以從中繼承,然后再根據(jù)需要對其進行修改。

在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中實現(xiàn)jinja2的繼承的方法了嗎?如果還想學到更多技能或想了解更多相關內容,歡迎關注億速云行業(yè)資訊頻道,感謝各位的閱讀!

向AI問一下細節(jié)

免責聲明:本站發(fā)布的內容(圖片、視頻和文字)以原創(chuàng)、轉載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權內容。

AI