flaks 分页案例展示

longly1111 / 2024-10-17 / 原文

html 页面代码

　　paginate 是路由

　　page 显示当前页面数据 ,

　　per_page 当前页面显示几条数据

<ul class="pagination">
　　{#  上一页代码  #}　　
　　<li class="page-item">
　　{% if p.has_prev %}   // 判断是否有上一页
　　　　<a class="page-link" href="/paginate/?page={{ p.prev num }}&per page=3" aria-label="previous">   // 有就执行 
　　{% else %}
　　　　<a class="page-link" href="javascript:," aria-label="Previous">  // 没有就不执行
　　{% endif %}
　　　　<span aria-hidden="true">&laquo;</span>    // 上一页的符号
　　</a>
　　</li>
　　
　　{#  中间循环体  #}
　　{% for i in range(p.pages)%}
　　　　{% if p.page ==i+1%}
　　　　　　<li class="page-item active">
　　　　{% else %}
　　　　　　<li class="page-item">
　　{% endif %}
　　　　<a class="page-link" href="/paginate/?page={{ i + 1 }}&per_page=3">{{ i + 1 }}</a>
　　</li>
　　{% endfor %}
　　
　　{# 下一页 #}
　　<li class="page-item">
　　{% if p.has next %}  // 判断有下一个
　　　　<a class="page-link" href="/paginate/?page={{ p.next num }}&per page=3">  // 有执行
　　{% else %}
　　　　<a class="page-link" href="javascript:;" aria-label="Previous">  // 没有不执行
　　{% endif %}
　　　　<span aria-hidden="true">&raquo;</span>  // 下一页图标 
　　</a>
　　</li>
　　
　　

</u1>