在py文件同級下 建立templates文件夾,再文件夾中編寫html文件
1 向模版中傳遞參數:
1 '''
2 1 向模板傳送 參數 3 '''
4 @app.route('/') 5 def index(): 6 name = 'Python'
7 context = { 8 'name':'Python', 9 'age' : 18 , 10 'num_list': [1,2,3,4,5,6,7,8,9,10] 11 } 12 return render_template('index.html',context=context,name=name )
1 <body>
2 hello world! 3
4 <br>
5 <p> {{ context }} </p>
6
7 姓名:{{ context['name'] }},{{ name }} 8 <br>
9 年齡:{{ context['age'] }} 10 <br>
11 num_list:{{ context['num_list'] }} 12 <br>
13 {% for i in context['num_list'] %} 14 <p>{{ i }}</p>
15 {% endfor %} 16
17
18 </body>
2 反向路由:
1 '''
2 2 反向路由 3 url_for(視圖函數名)) 能夠返回視圖的相對url 4 利用redirect( url_for(視圖函數) ) 實現重定向 5 '''
6 @app.route('/redirect') 7 def redi(): 8 redir = url_for('index',_external=True) 9 print(redir) 10 return redirect(redir)
3 過濾器、自定義過濾器:
1 '''
2 3 過濾器: 3
4 safe 禁用轉義 <p>{{ '<em>hello</em>' | safe }}</p> 5 capitalize 首字母大寫 <p>{{ 'hello' | capitalize }}</p> 6 lower 小寫 <p>{{ 'HELLO' | lower }}</p> 7 upper 大寫 <p>{{ 'hello' | upper }}</p> 8 title 每個單詞首字母大寫 <p>{{ 'hello' | title }}</p> 9 trim 去掉首位空格 <p>{{ ' hello world ' | trim }}</p> 10 reverse 反轉字符串 <p>{{ 'olleh' | reverse }}</p> 11 format 格式化 <p>{{ '%s is %d' | format('name',17) }}</p> 12 striptags 刪掉html標簽 <p>{{ '<em>hello</em>' | striptags }}</p> 13
14 列表操作: 15 first 取第一個元素 <p>{{ [1,2,3,4,5,6] | first }}</p> 16 last 取最后一個元素 <p>{{ [1,2,3,4,5,6] | last }}</p> 17 length 獲取列表長度 <p>{{ [1,2,3,4,5,6] | length }}</p> 18 sum 列表求和 <p>{{ [1,2,3,4,5,6] | sum }}</p> 19 sort 列表排序 <p>{{ [6,2,3,1,5,4] | sort }}</p> 20
21 語句塊過濾: 22 {% filter upper %} 23 this is a Flask Jinja2 introduction 24 {% endfilter %} 25
26 自定義過濾器: 兩種方式 27 1 app.add_template_filter(函數名,過濾器名) 28 2 @app.template_filter(過濾器名) 29 '''
30 @app.route('/filter') 31 def filter(): 32 str = 'abCdeF hello woRld'
33 li = [1,2,5,4,3,76,65,8,9] 34 return render_template('filter.html',str=str,li=li) 35 # 自定義過濾器
36 def hahah(li): 37 return str(li)+'hahaha'
38 app.add_template_filter(hahah,'hahah') 39
40 @app.template_filter('heihei') 41 def heihei(li): 42 return str(li) + 'heihei'
1 <body>
2 {{ str }} 3 <br>
4 {{ str | upper }} 5 <br>
6 {{ str | lower }} 7 <br>
8 {{ str | capitalize }} 9 <br>
10 {{ str | title }} 11 <br>
12 {{ str | reverse }} 13 <br>
14 列表操作: 15 <br>
16 {{ li }} 17 <br>
18 {{ li | length }} 19 <br>
20 {{ li | first }} 21 <br>
22 {{ li|last }} 23 <br>
24 {{ li | sort }} 25
26 <br>
27 塊過濾: 28 {% filter upper %} 29 hello worldQ! 30 {% endfilter %} 31 <br>
32
33 自定義過濾器: 34 <br>
35 {{ li | hahah }} 36 <br>
37 {{ li | heihei }} 38
39
40 </body>
4 web表單接收參數 wtf表單的使用:
1 '''
2 3 web表單 WTForms 3 '''
4 # 獲取常規表單數據的方法
5 @app.route('/form',methods=['GET','POST']) 6 def form(): 7 if request.method == 'POST': 8 username = request.form['username'] 9 password = request.form['password'] 10 print(username , password) 11 return render_template('form.html') 12
13
14 # 利用Flask的 WTF 實現表單
15 # 配置 csrf_token 的生成項
16 app.config['SECRET_KEY'] = 'python12'
17 # 配置表單類
18 class Form(FlaskForm): 19 # user字段 text類型input框 校驗輸入數據
20 user = StringField(validators=[DataRequired()]) 21 # equalto 檢測 與ps2 內容是否一樣
22 ps = PasswordField(validators=[DataRequired(),EqualTo('ps2','err')]) 23 ps2=PasswordField(validators=[DataRequired()]) 24 submit = SubmitField() 25
26 # 利用Flask的 WTF 實現表單
27 @app.route('/WTForm',methods=['GET','POST']) 28 def wtForm(): 29 form = Form() # 拿到一個表單對象
30 if form.validate_on_submit(): # 能夠自動檢驗 提交的表單是否經過驗證 返回True或者False
31 # 獲取表單數據
32 user = form.user.data 33 ps = form.ps.data 34 ps2 = form.ps2.data 35 print user,ps,ps2 36 if request.method == "POST": 37 # flask 操作后端
38 flash(u'信息發生錯誤!') 39
40 print(form.validate_on_submit()) #能夠檢驗 提交是否經過驗證,返回True或者False
41
42
43 return render_template('form.html',form=form)
1 <body>
2 普通表單: 3 <br>
4 <form method='post'>
5 <input type="text" name="username" placeholder='Username'>
6 <br>
7 <input type="password" name="password" placeholder='password'>
8 <br>
9 <input type="submit">
10 </form>
11 <hr>
12 WTF表單: 13 <form method="post">
14 {{ form.csrf_token() }} 15 {{ form.user.label }}:{{ form.user }} 16 <br>
17 {{ form.ps.label }}:{{ form.ps }} 18 <br>
19 {{ form.ps2.label }}:{{ form.ps2 }} 20 <br>
21 {{ form.submit }} 22 <br>
23 {% for info in get_flashed_messages() %} 24 {{ info }}<br>
25 {% endfor %} 26 </form>
27
28
29
30 </body>
4 宏的編寫與使用
1 '''
2 4 宏 繼承 包含 模板的使用 3 '''
4 @app.route('/macro') 5 def macro(): 6 return render_template('macro.html')
1 <body>
2 定義 宏 和調用 宏 3 <br>
4 {# 定義宏 #} 5 {% macro input(type,value,size) %} 6 <input type="{{ type }}" name="" value="{{ value }}" size="{{ size }}">
7 {% endmacro %} 8
9 {# 調用宏 #} 10 {{ input('text','登陸','60') }} 11 <br>
12 {{ input('password','注冊','20') }} 13
14 <br>
15
16 引用外部宏 17 <br>
18 {% import 'macros.html' as f %} 19 {{ f.fun() }} 20
21
22
23
24 </body>
外部宏:macros.html 文件:
1 {% macro fun() %} 2 <input type="text" name="username" placeholde="Username">
3 <br>
4 <input type="password" name="password" placeholde="Password">
5 <br>
6 <input type="submit">
7 <br>
8 {% endmacro %}