知識點: 一、宏的基本使用html
在Flask的模板中有一個特性和Django內不一樣,這個特性就是宏。宏的功能和python中的函數相似。python
{% macro 宏的名字(參數) %}
內容
{% endmacro %}
複製代碼
{{ 宏的名字(參數) }}
複製代碼
在python函數能夠實現代碼複用的做用,在模板中宏也有相似的做用。瀏覽器
建立一個Flask項目,並在模型聲明以下代碼:函數
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
{#聲明#}
{% macro macro_input() %}
輸入框:<input type="text"> <br>
{% endmacro %}
{#調用#}
{{ macro_input() }}
{{ macro_input() }}
</body>
</html>
複製代碼
咱們在瀏覽器調試一下: ui
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
{#聲明#}
{% macro macro_input(tip,type,name) %}
{{ tip }}<input type="{{ type }}" name="{{ name }}"> <br>
{% endmacro %}
{#調用#}
{{ macro_input('帳號:','text','email') }}
{{ macro_input('密碼:','password','pwd') }}
</body>
</html>
複製代碼
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
{#聲明#}
{% macro macro_input(tip,type,name,value='123') %}
{{ tip }}<input type="{{ type }}" name="{{ name }}" value="{{ value }}"> <br>
{% endmacro %}
{#調用#}
{{ macro_input('帳號:','text','email') }}
{{ macro_input('密碼:','password','pwd','123456789') }}
</body>
</html>
複製代碼
宏的定義能夠聲明在另外一個html中,而後經過import這種方式導入進來使用。新建一個html文件,聲明以下代碼:spa
{#聲明#}
{% macro macro_input(tip,type,name,value='123') %}
{{ tip }}<input type="{{ type }}" name="{{ name }}" value="{{ value }}"> <br>
{% endmacro %}
複製代碼
注意雖然是html文件,可是沒有html文件的結構。scala
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
{% from 'common_macro.html' import macro_input %}
{#別名#}
{#{% from 'common_macro.html' import macro_input as input %}#}
{#調用#}
{{ macro_input('帳號:','text','email') }}
{{ macro_input('密碼:','password','pwd','123456789') }}
</body>
</html>
複製代碼
varargs : 這是一個列表。若是調用宏時傳入的參數多於宏聲明時的參數,多出來的沒指定參數名的參數就會保存在這個列表中。3d
kwargs : 這是一個字典。若是調用宏時傳入的參數多於宏聲明時的參數,多出來的指定了參數名的參數就會保存在這個字典中。調試
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
{#聲明#}
{% macro macro_input(tip,type,name,value='123') %}
{{ tip }}<input type="{{ type }}" name="{{ name }}" value="{{ value }}"> <br>
<br>{{ varargs }}
<br> {{ kwargs }}<br>
{% endmacro %}
{{ macro_input('帳號:','text','email',11,22,33,44,age=12) }}
{{ macro_input('密碼:','password','pwd','123456789') }}
</body>
</html>
複製代碼
咱們在瀏覽器調試一下: code
歡迎關注個人公衆號: