注意:

1.在视图函数中通过request.args.get('page')获取page数,并将page传给macros.html模板文件

效果:

点击8,就跳转到第8页数据了

视图函数

@app.route('/auto_test_case', methods=['GET', 'POST'])
def auto_test_case(): form = SearchForm()
page = request.args.get('page', 1, type=int)
per_page = current_app.config['GOGOTEST_CASE_PRE_PAGE']
# 获取全部脚本测试用例
pagination = TestCase.query.paginate(page, per_page=per_page)
auto_test_case_objs=pagination.items
return render_template('auto_test_case.html', pagination=pagination,cases=auto_test_case_objs, form=form,page=page)

macros.html定义宏:

<!--分页导航-->
{% macro my_render_pagination(pagination, endpoint) %}
<ul class="pagination">
<!-- {# 上一页 #}-->
{% if pagination.prev_num %}
<li>
<a href="#" aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
</a>
</li>
{% else %}
<li class="disabled">
<a href="#" aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
</a>
</li>
{% endif %} {% for page in pagination.iter_pages() %}
{% if page %}
{% if page != pagination.page %}
<li>
<a href="{{ url_for(request.endpoint, page=page) }}">{{ page }}</a>
</li>
{% else %}
<li class="active">
<a><strong>{{ page }}</strong></a>
</li>
{% endif %}
{% else %}
<li>
<span class=ellipsis>…</span>
</li>
{% endif %}
{% endfor %}
<!-- {# 下一页 #}-->
{% if pagination.next_num %}
<li>
<a href="#" aria-label="Previous">
<span aria-hidden="true">&raquo;</span>
</a>
</li>
{% else %}
<li class="disabled">
<a href="#" aria-label="Previous">
<span aria-hidden="true">&raquo;</span>
</a>
</li>
{% endif %}
</ul>
{% endmacro %}

case_manage.html

导入宏

{%from "macros.html" import my_render_pagination%}

调用宏

<div class="page-footer">{{ my_render_pagination(pagination) }}

参考文档:

flask-bootstrap和分页

[Flask]jinja2渲染分页导航部件的更多相关文章

  1. 网站功能操作分布引导插件:Intro.js介绍;React里如何使用Intro.js以及如何进行分页导航

    插件作用:使用向导,引导新用户正确使用Web网站.我的环境是React+Mobx. 基本使用介绍,参加代码地址里的README.md:https://github.com/usablica/intro ...

  2. Flask模板渲染

    目录 Flask模板渲染 Jinja2模板引擎简介 模板 Jinja2 模板变量 变量 控制结构 宏,类似Python代码中的函数 模板继承 包含(Include) 过滤器 链式调用 常见内建过滤器 ...

  3. 初探 Python Flask+Jinja2 SSTI

    初探 Python Flask+Jinja2 SSTI 文章首发安全客:https://www.anquanke.com/post/id/226900 SSTI简介 SSTI主要是因为某些语言的框架中 ...

  4. Bootstrap系列 -- 44. 分页导航

    带页码的分页导航,可能是最常见的一种分页导航,特别是在列表页内容超多的时候,会给用户提供分页的导航方式.平时很多同学喜欢用div>a和div>span结构来制作带页码的分页导航.不过,在B ...

  5. 用flask实现的分页

    一.flask实现的分页组件 from urllib.parse import urlencode,quote,unquote class Pagination(object): "&quo ...

  6. wordpress文章页两侧添加分页导航箭头

    分页导航 如果添加在文章页的两侧,很方便读者翻阅,小编发现好多站长的博客都添加了这一功能,百度了一下,就是JS和css的功能,经过测试成功,分享一下流程. 1.添加Js 在headr.php或者foo ...

  7. Bootstrap学习-导航条-分页导航

    1.导航条基础 导航条(navbar)和上一节介绍的导航(nav),就相差一个字,多了一个“条”字.其实在Bootstrap框架中他们还是明显的区别.在导航条(navbar)中有一个背景色.而且导航条 ...

  8. bootstrap基础学习【导航条、分页导航】(五)

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. jinja2渲染使用

    说明:通过jinja2渲染后只能打印出来效果,目前无法保存 例1:渲染 .j2 文件 1.安装jinja2模块 pip3 install jinja2 2.定义模板 说明:变量必须是小写,大写有的情况 ...

随机推荐

  1. 全球首次!玩5G日本来了一波骚操作

    5G基站信号覆盖范围较小是5G技术应用中需要面临的问题之一,从目前的报道来看,在人口密集的城市中其理想覆盖范围只有250米左右,这也就意味着5G基站的数量和密度相比4G要成倍的增加. 可以想象,当5G ...

  2. (转) Linux安装启动FTP服务

    Linux安装启动FTP服务 Linux服务器默认是没有开启FTP服务的.也没有FTP服务器,为了文件的传输需要用到FTP服务器,以典型的vsftpd为例.vsftpd作为FTP服务器,在Linux系 ...

  3. PHP读取txt文件的内容并赋值给数组的代码

    使用file_get_contents()获取txt文件的内容,然后通过explode()把获得的字符串转化为数组. 获得数组长度可以使用count()函数 <?php $file = 'key ...

  4. 第五章 动画 48:动画-使用transition-group元素实例列表动画

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  5. [uboot] (番外篇)uboot relocation介绍(转)

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明.本文链接:https://blog.csdn.net/ooonebook/article/det ...

  6. k8spod控制器概述

    自主式pod对象由调度器绑定至目标工作节点后即由相应节点上的kubelet负责监控其容器的存活性,容器主进程崩溃后,kubelet能够自动重启相应的容器.不过,kubelet对非主进程崩溃类的容器错误 ...

  7. Ruby笔记

    1.数组遍历方法总结 array = (1..10).to_a length = array.length length.times do t print "#{array[t]} &quo ...

  8. Linux下C++编译(代码高亮自动换行)

    1.环境准备 在ubuntu中要想编译c程序可以安装gcc编译器,编译c++的话就不能使用gcc了,要使用g++编译器. 安装gcc或是g++可以在新立得软件包管理器中直接搜索后安装或是使用终端文字命 ...

  9. 【杂题】[AGC034D] Manhattan Max Matching【费用流】

    Description 有一个无限大的平面,有2N个位置上面有若干个球(可能重复),其中N个位置是红球,N个位置是蓝球,红球与蓝球的总数均为S. 给出2N个位置和上面的球数,现要将红球与蓝球完美匹配, ...

  10. jQuery_attr()操作

    下面来介绍jQuery的属性attr()操作: <!DOCTYPE html> <html> <head> <meta charset="UTF-8 ...