Python Flask No.5_Flask前后端间数据传递与展示
程序员文章站
2022-07-02 22:31:31
...
Python Flask No.5_Flask前后端间数据传递与展示
一.网站后端获取前端数据方法
1.1.首先定义好HTML
<body>
<a href='/?value=123'>链接传值</a>
<form method='get/post' action='action'>
<input type='text' name='text'>
<input type='radio' name='radio' value='male'>男
<input type='radio' name='radio' value='female'>女
<p><input type="checkbox" name="category" value="财经" />财经</p>
<p><input type="checkbox" name="category" value="汽车" />汽车</p>
<p><input type="checkbox" name="category" value="科技" />科技</p>
<p><input type="checkbox" name="category" value="房产" />房产</p>
<p><input type="checkbox" name="category" value="旅游" />旅游</p>
<button type='submit'>
</form>
</body>
from flask import request
@app.route('/',methods=['GET,'POST'])
def index():
vaule=request.form['name']#表单method为post方法,获取name为name的输入框值
value=request.args.get('value')#通过链接方式获取值
value=request.values.get('radio')#表单method为post方法，获取单选框值
values=request.form.getlist('category')##表单method为post方法，获取复选框值
return render_template('index.html')
二.Flask从后端向前端传值
2.1.Flask的app.py
from flask import request
@app.route('/',methods=['GET,'POST'])
def index():
msg='张三'
return render_template('index.html',info=msg)#info就是传给前端的数据
2.2.HTML怎么接收
<body>
<p>{{msg}}</p>
</body>
经过上述操作就能在网页中看到从后端传来的信息了
个人觉得这种方式非常方便，例如经过判断要给用户反馈信息通过这种方式就能把需要传递的信息简单有效的传到前端去。
三.补充内容
上述传递的数据是一个简单的字符串，我们要知道，有时候从后端传回的信息可能是一个复杂的数据结构，例如python的元组、列表等，这时候怎么传递给前端呢？这就要用到for循环了
3.1HTML界面
假如从后端传回的数据是data=((张三,123),(李四,456))，这显然是一个元组
<body>
{%for item in data%}
<p>{{item[0]</p>
<p>{{item[1]</p>
{%endfor%}
</body>
for的用法是这样，if同理，假如判断data=((张三,123),(李四,456))是否存在，存在显示数据，不存在显示异常
<body>
{%if data%}
{%for item in data%}
<p>{{item[0]</p>
<p>{{item[1]</p>
{%endfor%}
{%else%}
<p>No Data</p>
{%endif%}
</body>
四.后记
下一篇文章会介绍Python Flask templates Jinja2模板的继承，以此达到简化前端代码的目的
上一篇： Promise的一些个人理解