django基础之day08,分页器从无到有,动态思路解析全过程


*********分页器从无到有的全过程,动态思路解析如下:********

1.通过book_queryset = models.Book.objects.all()[start_num:end_num]
获取到用户在Book表中的所有数据,通过切片操作,获取用户的起始位数和终止位数

2.通过get请求方式,获取用户当前在第几页,current_page,默认在第一页
3.定义每页展示的条数pagenum=10
    获得三者之间的对应关系:
    startnum = (current_page-1) * pagenum
    endnum = currentpage * pagenum

4.遇到问题,用户想要哪一页不能自己手动选择,我们只写死了5页的数据,
不够符合业务需求,此时我们想到了要加一个分页器,在底部放置。

5.下面开始了分组的逻辑运算;
    5.1我们先要获取到数据表中总共有多少条数据
    5.2计算出来数据表中数据的总条数
    5.3通过all_page_num,more = divmod(总条数,每页数量),进行解压赋值操作
        [divmod(a,b)方法可以用来查看所需要的分组是多少]
    5.4 if more != 0:   #此处也可以写成if more:代表有值,老师的写法
        获取到了总共的页码数量:all_page_num +=1

    5.5后端通过空字符串:html=''
        循环总页码all_page_num次:for i in range(all_page_num):
        这样html字符串进行连续的拼接:html += '<li><a href="?page=%s">%s</a></li>'%(i,i)


    5.6然后通过渲染方法,把后端代码html字符串渲染到前端页面上,
        通过safe模式{{ html|safe }}渲染代码,安全打开。


6.但是此时我们还是会遇到一个问题,就是把所有的页码全部展示出来了,
不符合用户规范和使用的需求,那么我们下一步该如何进行优化呢?
    6.1我们想要一共展示11位的页码,我们采取
    for循环当前页-5页和当前页+5页的一个范围,作为此次的改进,
        html=''
        for i in range(current_page-5,current_page+5):
            html += '<li><a href="?page=%s">%s</a></li>'%(i,i)

    6.2高亮显示用户选择的页码,怎么做呢?
        思路:
            1.判断用户当前的页码(浏览器url地址中的页码:current_page 变量)
            和点击的页面页码是否相等 (鼠标移动的页面页码:i 变量)
            如果两者相等:<li>标签中加入class="active",
            两者不相等,<li>标签中不加入。
            2.页码必须从1开始,该如何设置呢?
                思路:举例子即可,当前页current_page赋值给变量XXX,
                例如当前页current_page是第三页,第三页小于6,那么变量XXX=6,
                程序往下继续执行,循环范围依然是从6-5=1开始,到11结束。
                
            html='' #空字符串
            xxx=current_page
            if current_page < 6:
                xxx=6
            # 改进为采取for循环当前页-5页和当前页+5页的一个范围
            for i in range(xxx-5,xxx+6):      #顾头不顾尾,所以右边取到6
                if current_page == i:
                #这样html字符串进行连续的拼接
                    html += '<li class="active"><a href="?page=%s">%s</a></li>'%(i,i)
                else:
                    html += '<li><a href="?page=%s">%s</a></li>'%(i,i)


********************************************************************************************************************
                                        代码如下代码如下
********************************************************************************************************************

models.py文件



#批量插入数据,制作分页器作业
class Book(models.Model):
    title=models.CharField(max_length=32)

    def __str__(self):
        return self.title





urls.py文件

from django.conf.urls import url
from django.contrib import admin
from app01 import views
urlpatterns = [
    url(r'^admin/', admin.site.urls),
    #首页
    url(r'^$', views.home),
    #访问该url就会往book表中插入1000条数据
    url(r'^index/', views.index),

]








views.py文件

def index(request):
    # 定义一页展示的条数
    per_page_num=10
    #拿出来数据表中所有的数据
    book_queryset = models.Book.objects.all()
    #计算出来数据表中数据的总条数
    all_count=book_queryset.count()
    #通过divmod(总数,每页数量)获得需要的总页码,进行解压赋值操作
    # [divmod()方法可以用来查看所需要的分组是多少]
    all_page_num,more=divmod(all_count,per_page_num)
    # 用户查看的当前页码,默认为第一页,下面是三个变量之间的关系
    current_page = request.GET.get('page', 1)  # 当前页
    current_page = int(current_page)
    start_num = (current_page - 1) * per_page_num
    end_num = current_page * per_page_num

    if more != 0:   #此处也可以写成if more:代表有值的条件
        #获取到了总共的页码数量
        all_page_num +=1





    html='' #空字符串
    xxx=current_page
    if current_page < 6:
        xxx=6
    # 改进为采取for循环当前页-5页和当前页+5页的一个范围
    for i in range(xxx-5,xxx+6):      #顾头不顾尾,所以右边取到6
        if current_page == i:
        #这样html字符串进行连续的拼接
            html += '<li class="active"><a href="?page=%s">%s</a></li>'%(i,i)
        else:
            html += '<li><a href="?page=%s">%s</a></li>'%(i,i)


    #对数据表中的数据进行切分操作
    book_queryset=book_queryset[start_num:end_num]
    return render(request,'index.html',locals())







index.html文件






<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>index页面批量插入数据作业</title>
    <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
    <link href="https://cdn.bootcss.com/twitter-bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://cdn.bootcss.com/twitter-bootstrap/3.3.1/js/bootstrap.min.js"></script>

</head>
<body>
<div class="container-fluid">
    <div class="row">
        <div class="col-md-8 col-md-offset-2">
            {% for book in book_queryset %}

                <p>{{ book.title }}</p>

            {% endfor %}
            <nav aria-label="Page navigation">
                <ul class="pagination">
                    <li>
                        <a href="#" aria-label="Previous">
                            <span aria-hidden="true">&laquo;</span>
                        </a>
                    </li>
                    {{ html|safe }}
                    <li>
                        <a href="#" aria-label="Next">
                            <span aria-hidden="true">&raquo;</span>
                        </a>
                    </li>
                </ul>
            </nav>

        </div>
    </div>

</div>
</body>
</html>



























posted @ 2019-12-03 01:10  大海一个人听  阅读(222)  评论(0编辑  收藏  举报