Flask第37篇——模板项目实战（三）
今天我们来完成更多的模块，点击更多后页面显示效果如上图。
我们先来分析上面这个页面，我们发现除了搜索栏下面的图片区域有些变化以外，其余都是base.html的布局，所以我们首先想到可以继承base.html，而图片显示规则则和我们前面定义过的宏完全一致，我们就可以导入写好的宏。
所以我们先在templates文件夹下新建moreList.html文件：
我们已经在base.html中保留了block，所以页面新的布局只需要通过block进行插入即可：
moreList.html
{% extends 'base.html' %}
{% from 'macros/macros.html' import itemGroup %}
{% block head %}
<link rel="stylesheet" href="{{ url_for('static', filename='css/item.css') }}">
<style>
.content{
padding: 25px 10px;
}
</style>
{% endblock %}
{% block content %}
<div class="content">
{% for item in items %}
{{ itemGroup(item) }}
{% endfor %}
</div>
{% endblock %}当然，我们还要将更多加上链接，我们先定义函数：
@app.route('/list/<int:category>/')
def itemList(category):
# 如果category等于1：返回电影
# 如果category等于2：返回电视剧
# 否则返回空数组
items = []
if category == 1:
items = movies
elif category == 2:
items = tvs
else:
items = []
return flask.render_template('moreList.html', items=items)这里我们新加了一个整型的category参数，方便我们对进入的页面到底是电影还是电视剧进行分辨，在macros.html文件中需要加上更多的链接：
<a href="{{ url_for('itemList', category=category) }}" class="more-btn">更多</a>这样就会完成点击`更多`后的页面跳转和跳转后的页面布局啦~~
本文参与 腾讯云自媒体分享计划，分享自微信公众号。
原始发表：2018-11-29，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读