打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
数据库|Flask实现分页显示数据
效果图
在做网页的时候,通常会展示很多数据,如果把全部数据放在一页显示的话,会让浏览器加载变得更慢,所以通常在展示很多数据的时候进行分页显示,让浏览器进行片段式加载。先上一个效果图:
步骤
首先是路由(views.py):设计思路是根据查询的页码作为参数,利用FlaskSQLAlchemy的Model进行查询并对查询结果进行分页处理。
@admin.route("/course/list/<int:page>/", methods=["GET"])
def courses_list(page=None):
if page is None:#如果没有page则显示第一页
page = 1
page_data = T_courses.query.order_by(
T_courses.cno.asc()#按照课程号正序排列
).paginate(page=page, per_page=10)
#paginate方法返回一个sqlalchemy.Pagination类型对象
return render_template("admin/courses_list.html", page_data=page_data)
page_data是一个FlaskSQLAlchemy中的Pagination类型对象一个Query对象调用paginate方法就获得了Pagination对象。paginate方法传入了两个参数,一个是当前页,另一个是每一页最多显示多少数据。paginate的返回值为代表当前页的Pagination对象。
一个Paginationi对象的常用属性有:
items 当前页面中的所有记录(比如当前页上有5条记录,items就是以列表形式组织这5个记录)
query 当前页的query对象(通过query对象调用paginate方法获得的Pagination对象)
page 当前页码(比如当前页是第5页,返回5)
prev_num 上一页页码
next_num 下一页页码
has_next 是否有下一页 True/False
has_prev 是否有上一页 True/False
pages 查询得到的总页数 per_page 每页显示的记录条数
total 总的记录条数
常用方法有:
prev() 上一页的分页对象Pagination
next() 下一页的分页对象Pagination
iter_pages(left_edge=2,left_current=2,right_current=5,right_edge=2)
iter_pages 用来获得针对当前页的应显示的分页页码列表。
假设当前共有100页,当前页为50页,按照默认的参数设置调用iter_pages获得的列表为:
[1,2,None,48,49,50,51,52,53,54,55,None,99,100]
接下来是模板,一个是显示课程的页面(courses_list.html),
一个是分页页面(admin_page.html)
{% import "ul/admin_page.html" as pg %}
{% for v in page_data.items %}
<tr>
<td>{{v.cno}}</td>
<td>{{v.cname}}</td>
<td>{{v.credit}}</td>
<td>{{v.hour}}</td>
<td>{{v.theory_hour}}</td>                                 <td>{{v.practice_hour}}</td>
<td>{{v.year}}</td>
<td>{{v.term}}</td>
<td>{{v.methods}}</td>
</tr>
{% endfor %}
{{ pg.page(page_data,'admin.courses_list') }}
这段代码首先是导入了admin_page.html,然后使用for循环对views.py查询到的内容进行遍历,接着向分页模板页面传入了两个值。
接下来是分页模板页面页面:
{% macro page(data,url) %}
{% if data %}
<ul class="pagination pagination-sm no-margin pull-right">
<li><a href="{{ url_for(url,page=1) }}">首页</a></li>
{% if data.has_prev %}
<li><a href="{{ url_for(url,page=data.prev_num) }}">上一页</a></li>
{% else %}
<li><a href="#">上一页</a></li>
{% endif %}
{% if data.pages>5%}
{% if data.page <4 %}
{% for i in range(1,4) %}
{% if i == data.page %}
<li><a href="#">{{ i }}</a></li>
{% else %}
<li><a href="{{ url_for(url,page=i) }}">{{ i }}</a></li>
{%endif%}
{% endfor %}
{%elif (data.pages-data.page)<3%}
{% for i in range(data.pages-3,data.pages+1) %}
{% if i == data.page %}
<li><a href="#">{{ i }}</a></li>
{% else %}
<li><a href="{{ url_for(url,page=i) }}">{{ i }}</a></li>
{%endif%}
{% endfor %}
{%else%}
{% for i in range(data.page-3,data.page+4) %}
{% if i == data.page %}
<li><a href="#">{{ i }}</a></li>
{% else %}
<li><a href="{{ url_for(url,page=i) }}">{{ i }}</a></li>
{%endif%}
{% endfor %}
{%endif%}
{%else%}
{% for v in data.iter_pages()%}
{% if v == data.page %}
<li><a href="#">{{ v }}</a></li>
{% else %}
<li><a href="{{ url_for(url,page=v) }}">{{ v }}</a></li>
{% endif%}
{% endfor %}
{% endif%}
{% if data.has_next %}
<li><a href="{{ url_for(url,page=data.next_num) }}">下一页</a></li>
{% else %}
<li><a href="#">下一页</a></li>
{% endif %}
<li><a href="{{ url_for(url,page=data.pages) }}">尾页{{data.pages}}</a></li>
</ul>
{% endif %}
{% endmacro  %}
这段代码整体来说是根据当前页对上一页、页码、下一页进行不同的设置,利用了利用JinJa2的if语句。
1、判断当前页码,只显示当前页码上下三页的选项,如果直接将左右页码展示出来,数据太多会直接报错。
2、判断是否还有前一页和后一页,如果没有才能点击上一页和下一页,否则不能点击。
3、判断页码中是否为当前页,将本页的页码显示为高亮,让用户判断当前页是第几页。
END主  编   |   王文星
责  编   |   刘玉江
where2go 团队
微信号:算法与编程之美
本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
Django——完美的分页器
基于vue2.0的一个分页组件
python测试开发django-115.Paginator分页器展示table表格数据
dede列表分页问题解决
分页实例
分页组件的使用
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服