首页 > 名博 > 正文

我的博客搭建之Django分页

关于分页:

1、Django提供了分页工具Paination

2、官网文档地址https://docs.djangoproject.com/en/2.1/topics/pagination/

3、下面是一个在视图中使用的示例

#views.py

fromdjango.core.paginatorimportPaginator#引入Paginator对象

fromdjango.shortcutsimportrender

"""

Pagintor接收两个参数第一个可以是一个列表、元组、或QuerySet第二个参数是准备

每页的数量

"""

deflisting(request):

contact_list=Contacts.obhects.all()#得到一个QuerySet

paginator=Paginator(contact_list,25)#把这个对象穿进去,并每页展示25

page=request.GET.get('page',1)#得到访问的是第几页,默认值为1

contacts=paginator.get_page(page)#获取对应页获取的内容

returnrender(request,'list.html',{'contacts':contacts})#list.html

#要展示的内容

{%forcontactincontacts%}

{#Each"contact"isaContactmodelobject.#}

{#每个contact都是一个Contact对象可以直接获取这个模型对应字段的值#}

{{contact.full_name|upper}}

...

{%endfor%}

{#分页#}

<divclass="pagination">

<spanclass="step-links">

{%ifcontacts.has_previous%}

{#如果有上一页,点击进入上一页#}

<ahref="?page=1">&laquo;first</a>

<ahref="?page={{contacts.previous_page_number}}">previous</a>

{%endif%}

<spanclass="current">

{#显示当前在第几页#}

Page{{contacts.number}}of{{contacts.paginator.num_pages}}.

</span>

{%ifcontacts.has_next%}

{#如果有下一页,点击进入下一页#}

<ahref="?page={{contacts.next_page_number}}">next</a>

<ahref="?page={{contacts.paginator.num_pages}}">last&raquo;</a>

{%endif%}

</span>

</div>Django自带的分页工具已经能够满足基本的需求,但如果有很多页面都需要分页,将会有很多重复的工作,我们可以使用一个第三方应用dj-pagination,这个应用在pagination上进行的封装,可以减少我们很多的工作量。我的博客就是基于这个第三方应用进行的分页。


参考文档:https://dj-pagination.readthedocs.io/en/latest/usage.html#custom-pagination-templates

安装

pipinstalldj-pagination使用

1、在INSTALLED_APPS添加应用

INSTALLED_APPS=(

#...

'dj_pagination',

)2、安装分页中间件

MIDDLEWARE=(

#...

'dj_pagination.middleware.PaginationMiddleware',

)

3、在使用分页插件的html页面中加载分页标签

{%loadpagination_tags%}4、确定分页的变量

#object_list为后端传来的queryset数据比如下面的blogs

{%autopaginateobject_list%}#views.py

degget_blog(request):

blogs=Blog.object.all()

data={

'blogs':blogs

}

returnrender(request,'index.html',context=data)5.加载默认样式的分页

{%paginate%}6、有个完整的小示例(注意这样写会使用自带的简单的分页样式,样式比较丑)

{%loadpagination_tags%}

{%autopaginateblogs%}

{%forbloginblogs%}

{{blog.name}}

{%endfor%}

{%paginate%}7.加载并使用自定义样式

#在templates文件夹下创建pagination文件

#在pagination文件夹下创建my_pagination.html

#my_pagination.html

<style>

ul.pagination{

display:inline-block;

padding:0;

margin:0;

}

ul.paginationli{display:inline;}

ul.paginationlia{

color:black;

float:left;

padding:8px16px;

text-decoration:none;

transition:background-color.3s;

border:1pxsolid#ddd;

}

.paginationli:first-childa{

border-top-left-radius:5px;

border-bottom-left-radius:5px;

}

.paginationli:last-childa{

border-top-right-radius:5px;

border-bottom-right-radius:5px;

}

ul.paginationlia.active{

background-color:#4CAF50;

color:white;

border:1pxsolid#4CAF50;

}

ul.paginationlia:hover:not(.active){background-color:#ddd;}

.pagination>.disabled>a,

.pagination>.disabled>a:hover,

.pagination>.disabled>a:focus{

color:#777;

cursor:not-allowed;

background-color:#fff;

border-color:#ddd;

}

</style>

{%ifis_paginated%}

{%loadi18n%}

<ulclass="pagination">

{%ifpage_obj.has_previous%}

<li><ahref="?page{{page_suffix}}={{page_obj.previous_page_number}}{{getvars}}{{hashtag}}">«</a></li>

{%else%}

<liclass="disabled"><ahref="javascript:volid(0);">«</a></li>

{%endif%}

{%forpageinpages%}

{%ifpage%}

{%ifequalpagepage_obj.number%}

<li><aclass="active"href="#">{{page}}</a></li>

{%else%}

<li><ahref="?page{{page_suffix}}={{page}}{{getvars}}{{hashtag}}"class="page">{{page}}</a></li>

{%endifequal%}

{%else%}

<li><ahref="#">...</a></li>

{%endif%}

{%endfor%}

{%ifpage_obj.has_next%}

<li><ahref="?page{{page_suffix}}={{page_obj.next_page_number}}{{getvars}}{{hashtag}}">&raquo;</a></li>

{%else%}

<liclass="disabled"><ahref="javascript:volid(0);">&raquo;</a></li>

{%endif%}

</ul>

{%endif%}#使用

{%paginateusing"pagination/my_pagination.html"%}8、在settings.py 设置通用配置

PAGINATION_DEFAULT_PAGINATION每页显示数量

PAGINATION_DEFAULT_WINDOW分页显示在当前页左右两边的页数

PAGINATION_DEFAULT_ORPHANS最后一页显示的最小页数,默认为0

PAGINATION_INVALID_PAGE_RAISES_404当页数不存在时,是否显示404页面


效果图 颜色和样式可以在my_pagination.html 根据自己喜好修改

网友评论

验证码 换一张
取 消
暂无评论...
为您推荐
  • 相关阅读
  • 业界资讯
  • 手机通讯
  • 电脑办公
  • 新奇数码
  • 软件游戏
  • 科学探索