Python攻城师的成长——Django框架（自带的序列化组件、批量数据操作、分页器、forms组件）

最新推荐文章于 2024-08-24 06:57:55 发布

絵飛的

最新推荐文章于 2024-08-24 06:57:55 发布

阅读量367

点赞数

分类专栏： Django框架文章标签： django python 前端

本文链接：https://blog.csdn.net/fonnt/article/details/124885499

版权

Django框架专栏收录该内容

12 篇文章 0 订阅

订阅专栏

今日学习目标

掌握知识点自带的序列化组件、批量数据操作、分页器、forms组件，重点掌握forms组件

文章目录

今日学习目标
学习内容
一、django自带的序列化组件
二、批量数据操作
三、分页器
四、校验性组件之forms组件（部分）
作业练手

学习内容

django自带的序列化组件
批量数据操作
分页器
校验性组件之forms组件（部分）

一、django自带的序列化组件

前后端分离之后 django orm产生的queryset无法直接被前端识别还是需要json格式数据(硬通货)
为了去减少程序员自己去一点点的将数据进行转化处理，也是使得框架的·功能更加强大所以就提供了自动帮你序列化一些数据的功能
使用举例：
将用户表的数据查询出来返回给前端，给前端的是一个大字典，字典里面的数据是一个个的字段
后端代码
在这里插入图片描述
前端代码

<body>
	{{ res }}  # 把后端的res传过来，能代替下面一大段代码，把数据展示到前端页面上
    
	{% for foo in user_list %}
		<p>{{ foo.username }}</p>
		<p>{{ foo.password }}</p>
		<p>{{ foo.gender }}</p>
	{% endfor %}
</body>

二、批量数据操作

用bulk_create

def index(request):
    # 1、往书籍表中插入数据1000条
    # for i in range(1000):   # 这种插入方式，效率极低
    #     models.Book.objects.create(title='第%s本书'%i)
    
    book_list = []
    for i in range(100000):  # 插100000条，速度还是很快
        book_list.append(models.Book(title='第%s本书'%i'))
    models.Book.objects.bulk_create(book_list)   # 批量插入数据
    
    # 2将刚刚插入的数据查询出来展示到前端
    book_queryset = models.Book.objects.all()
    return render(request, 'index.html', locals())

三、分页器

引言：

网站不可能将所有的数据全部展示到一页，应该考虑使用分页每页展示一些
1.all()结果集支持正数的索引切片
2.分页相关参数数学关系
3.后端渲染前端分页代码
4.后端限制分页展示数量
5.当页面小于6或者大于N都需要额外限制
…
以后可能很多地方都需要使用分页不可能重复编写所以封装成了模块

分页器推导流程

from django.shortcuts import render,HttpResponse,redirect
from app01 import models
# Create your views here.
from django.core.exceptions import  ValidationError
def index(request):
    # 1.往书籍表中插入数据 1000
    # for i in range(1000):  # 这种插入方式 效率极低
    #     models.Book.objects.create(title='第%s本书'%i)
    # book_list = []
    # for i in range(100000):
    #     book_list.append(models.Book(title='第%s本书'%i))
    # models.Book.objects.bulk_create(book_list)  # 批量插入数据
    # 2.将刚刚插入的数据查询出来展示到前端

    # 1.获取用户想要访问的页码数
    current_page = request.GET.get('page',1)  # 如果没有page参数 默认就展示第一页
    # 转成整型
    current_page = int(current_page)
    # 2.每页展示10条数据
    per_page_num = 10

    # 3.定义起始位置和终止位置
    start_page = (current_page - 1) * per_page_num
    end_page = current_page * per_page_num

    # 4.统计数据的总条数
    book_queryset = models.Book.objects.all()
    all_count = book_queryset.count()

    # 5.求数据到底需要多少页才能展示完
    page_num, more = divmod(all_count,per_page_num)  # divmod(100,10)
    if more:
        page_num += 1
    # page_num就觉得了 需要多少个页码
    page_html = ''
    xxx = current_page  # xxx就是用户点击的数字
    if current_page < 6:
         current_page = 6
    for i in range(current_page-5,current_page+6):
        if xxx == i:
            page_html += '<li class="active"><a href="?page=%s">%s</a></li>'%(i,i)
        else:
            page_html += '<li><a href="?page=%s">%s</a></li>' % (i, i)

    book_queryset = book_queryset[start_page:end_page]
    return render(request,'index.html',locals())

"""
per_page_num = 10
current_page                   start_page                      end_page
    1                              0                                10
    2                              10                               20
    3                              20                               30 
    4                              30                               40

per_page_num = 5
current_page                   start_page                      end_page
    1                              0                                5
    2                              5                                10
    3                              10                               15 
    4                              15                               20

start_page = (current_page - 1) * per_page_num
end_page = current_page * per_page_num

"""

自定义分页器的使用：分页器组件

class Pagination(object):

def __init__(self, current_page, all_count, per_page_num=10, pager_count=11):
    """
    封装分页相关数据
    :param current_page: 当前页
    :param all_count:    数据库中的数据总条数
    :param per_page_num: 每页显示的数据条数
    :param pager_count:  最多显示的页码个数

    用法:
    queryset = model.objects.all()
    page_obj = Pagination(current_page,all_count)
    page_data = queryset[page_obj.start:page_obj.end]
    获取数据用page_data而不再使用原始的queryset
    获取前端分页样式用page_obj.page_html
    """
    try:
        current_page = int(current_page)
    except Exception as e:
        current_page = 1

    if current_page < 1:
        current_page = 1

    self.current_page = current_page

    self.all_count = all_count
    self.per_page_num = per_page_num

    # 总页码
    all_pager, tmp = divmod(all_count, per_page_num)
    if tmp:
        all_pager += 1
    self.all_pager = all_pager

    self.pager_count = pager_count
    self.pager_count_half = int((pager_count - 1) / 2)

@property
def start(self):
    return (self.current_page - 1) * self.per_page_num

@property
def end(self):
    return self.current_page * self.per_page_num

def page_html(self):
    # 如果总页码 < 11个：
    if self.all_pager <= self.pager_count:
        pager_start = 1
        pager_end = self.all_pager + 1
    # 总页码  > 11
    else:
        # 当前页如果<=页面上最多显示11/2个页码
        if self.current_page <= self.pager_count_half:
            pager_start = 1
            pager_end = self.pager_count + 1

        # 当前页大于5
        else:
            # 页码翻到最后
            if (self.current_page + self.pager_count_half) > self.all_pager:
                pager_end = self.all_pager + 1
                pager_start = self.all_pager - self.pager_count + 1
            else:
                pager_start = self.current_page - self.pager_count_half
                pager_end = self.current_page + self.pager_count_half + 1

    page_html_list = []
    # 添加前面的nav和ul标签
    page_html_list.append('''
                <nav aria-label='Page navigation>'
                <ul class='pagination'>
            ''')
    first_page = '<li><a href="?page=%s">首页</a></li>' % (1)
    page_html_list.append(first_page)

    if self.current_page <= 1:
        prev_page = '<li class="disabled"><a href="#">上一页</a></li>'
    else:
        prev_page = '<li><a href="?page=%s">上一页</a></li>' % (self.current_page - 1,)

    page_html_list.append(prev_page)

    for i in range(pager_start, pager_end):
        if i == self.current_page:
            temp = '<li class="active"><a href="?page=%s">%s</a></li>' % (i, i,)
        else:
            temp = '<li><a href="?page=%s">%s</a></li>' % (i, i,)
        page_html_list.append(temp)

    if self.current_page >= self.all_pager:
        next_page = '<li class="disabled"><a href="#">下一页</a></li>'
    else:
        next_page = '<li><a href="?page=%s">下一页</a></li>' % (self.current_page + 1,)
    page_html_list.append(next_page)

    last_page = '<li><a href="?page=%s">尾页</a></li>' % (self.all_pager,)
    page_html_list.append(last_page)
    # 尾部添加标签
    page_html_list.append('''
                                       </nav>
                                       </ul>
                                   ''')
    return ''.join(page_html_list)

后端使用views.py

from app01.utils.mypage import Pagination
# 使用封装好的分页器代码
def login(request):
    book_queryset = models.Book.objects.all()  # 先得到书的所有数据对象
    # 获取用户想要访问的页码数，没有page参数，就默认展示第一页
    current_page = request.GET.get('page',1)   # 获取当前页
    all_count = book_queryset.count()   # 获取数据的总条数
    # 1.实例化产生对象
    page_obj = Pagination(current_page=current_page,all_count=all_count)
    # 2.对真实数据进行切片操作
    page_queryset = book_queryset[page_obj.start:page_obj.end]
    return render(request,'login.html',locals())

前端展示数据login.html

<body>

{% for book_obj in page_queryset %}
    <p>{{ book_obj.title }}</p>
{% endfor %}
{{ page_obj.page_html|safe }}

</body>

四、校验性组件之forms组件（部分）

前言

编写一个校验用户名和密码是否合法的功能

前端需要自己编写获取用户数据的各种标签
前端需要自己想方设法的展示错误的提示信息
后端需要自己想方设法的编写校验代码(很多if判断)

注意：
校验数据通常是前后端都有校验
但是前端校验可有可无哪怕再牛逼
后端也必须要有校验反正一句话前端可有不校验后端必须校验！！！

功能实现：
1.搭建前端页面 >>> 渲染页面
2.获取前端用户提交的数据校验 >>> 校验数据
3.对数据的校验的结果展示到前端页面给用户查看 >>> 展示错误信息

forms组件能够自动帮你完成三件事：

渲染页面
校验数据
展示信息

forms组件基本用法

首先要先写一个类

from django import forms

class MyRegForm(forms.Form):
	username = forms.CharField(min_length=3,max_length=8)
	password = forms.CharField(min_length=3,max_length=8)
	email = forms.EmailField()

校验数据

在pycharm下面的Python Console窗口中进行校验测试，会自动搭建测试环境

测试代码：

from app01 import views
# 1.给自定义的类传一个字典
obj = views.MyRegForm({'username':'jason','password':'12','email':'123'})

# 2.判断数据是否全部合法
obj.is_valid()  # 只有数据全部符合要求才会是True
结果: False
    
# 3.查看符合校验规则的数据
obj.cleaned_data
结果: {'username': 'jason'}
    
# 4.查看不符合条件的数据以及不符合的原因是什么
obj.errors
结果: 
{
	'password': ['Ensure this value has at least 3 characters (it has 2).'],
	'email': ['Enter a valid email address.']
}
            
# 5.校验数据的时候 默认情况下类里面所有的字段都必须传值
obj = views.MyRegForm({'username':'jason','password':'123'})
obj.is_valid()
结果: False
obj.errors
结果: {'email': ['This field is required.']}  # 没有给表中的email字段传值，就无法通过校验
    
# 6.默认情况下可以多传 但是绝对不能少传
obj = views.MyRegForm({'username':'jason','password':'1233','email':'123@qq.com','xxx':'ooo'})
obj.is_valid()
结果: True

渲染页面

注意事项：
1.forms组件在帮你渲染页面的时候只会渲染获取用户输入(输入，选择，下拉框…)的标签提交按钮需要你手动添加
2.input框的label注释不指定的情况下默认用的类中字段的首字母大写

三种渲染前端页面的方式
后端

from django import forms

class MyRegForm(forms.Form):
	username = forms.CharField(min_length=3,max_length=8,label='用户名')
	password = forms.CharField(min_length=3,max_length=8,label='密码')
	email = forms.EmailField(label='邮箱')
    
def formmm(request):
    # 1.生成一个空的对象
    form_obj = MyRegForm()
    if request.method == 'POST':
        # 2.获取用户提交的数据
        # print(request.POST)  # request.POST  其实也可以看成是一个字典
        # 3.借助于form组件帮助我们校验
        form_obj = MyRegForm(request.POST)  # 由于request.POST其实就是一个大字典 所以直接当做参数传入即可  # 注意：这个form_obj对象名必须跟上面的form_obj对象名一致
        # 4.判断用户输入的数据是否符合校验规则
        if form_obj.is_valid():
            return HttpResponse('上传成功！！')
    return render(request,'formmm.html',locals())

第一种渲染页面的方式(封装程度太高，标签样式及参数不方便调整，可扩展性差，一般只用于本地测试不推荐使用)

<p>
{{ form_obj.as_p }}  
{{ form_obj.as_ul }}
{{ form_obj.as_table }}    
</p>

第二种渲染页面的方式：扩展性较高，但不足之处在于需要手写的代码量比较多(不推荐使用)

<p>{{ form_obj.username.label }}{{ form_obj.username }}</p>
<p>{{ form_obj.password.label }}{{ form_obj.password }}</p>
<p>{{ form_obj.email.label }}{{ form_obj.email }}</p>

第三种渲染前端页面的方式：代码量比较少，可扩展性都很高(推荐使用)

<p>
{% for foo in form_obj %}
    <P>{{ foo.label }}{{ foo }}</P>
{% endfor %}
</p>

想要input框前的名字是中文，在后端的字段中直接加参数label=‘用户名’

eg :

views.py

from django import forms
class MyRegForm(forms.Form):
	username = forms.CharField(min_length=3,max_length=8,label='用户名')
	password = forms.CharField(min_length=3,max_length=8,label='密码')
	email = forms.EmailField(label='邮箱')

展示错误信息

补充：
取消前端校验功能
校验数据的时候可以前后端都校验做一个双重的校验，但是前端的校验可有可无，而后端的校验则必须要有,因为前端的校验可以通过爬虫直接避开。
前端取消浏览器校验功能：form标签添加novalidate属性即可：

<form action="" method='post' novalidate></form>

展示错误信息
展示错误信息：用后端传过来的对象.errors.0

form action="" method="post" novalidate>
    {% for foo in form_obj %}
    <p>
        {{ foo.label }}:{{ foo }}   <!--渲染前端页面-->
        <span style="color: red">{{ foo.errors.0 }}</span>   <!--展示错误信息显示在input框的后面-->
    </p>
    {% endfor %}
    <input type="submit">
</form>

上述的方法展示出来的错误信息时英文，那怎么把它变成中文显示呢，来看以下代码：

from django import forms

class MyRegForm(forms.Form):
	username = forms.CharField(min_length=3,max_length=8,label='用户名',
                              # 指定error_messages参数来把错误信息用中文展示出来
							error_messages={    
								'min_length':'用户名最短三位',  
								'max_length':'用户名最长八位',
								'required':'用户名不能为空'
							},initial='我是初始值'  # 这个参数是给input框设置初始值
							)

	password = forms.CharField(min_length=3,max_length=8,label='密码',
							error_messages={
								'min_length':'密码最短三位',
								'max_length':'密码最长八位',
								'required':'密码不能为空'
							})

	email = forms.EmailField(label='邮箱',error_messages={
								'required':'邮箱不能为空',
								'invalid':'邮箱格式不正确'
							},required=False)   # 把required参数指定为False，表示这个字段的参数可以不传，如果传了的话也依然还是会校验的。

作业练手

ajax + sweetalert实现二次确认操作

sweetalert和bootstrap是大差不差的，我们把这个文件下载下来就行，ajax + sweetalert将会实现怎样的一个效果呢？他就是在我们去删除一行数据的时候弹出一个下拉框，我们主要做的就是将这个下拉框中做的事情传给后端，后端再进行数据库中的数据删除。

前端页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</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>#}
    {% load static %}
   {% load static %}
    <link rel="stylesheet" href="{% static 'dist/sweetalert.css' %}">
    <script src="{% static 'dist/sweetalert.min.js' %}"></script>
    <style>
        div.sweet-alert h2 {
            padding-top: 10px;
        }
    </style>
</head>
<body>
<div class="container-fluid">
    <div class="row">
        <div class="col-md-8 col-md-offset-2">
            <h2>数据展示</h2>
            <table class="table table-hover table-striped table-bordered">
                <thead>
                    <tr>
                        <th>序号</th>
                        <th>用户名</th>
                        <th>性别</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    {% for user_obj in user_queryset %}
                        <tr>
                            <td>{{ forloop.counter }}</td>
                            <td>{{ user_obj.username }}</td>
                            <td>{{ user_obj.get_gender_display }}</td>
                            <td>
                                <a href="#" class="btn btn-primary btn-sm">编辑</a>
                                <a href="#" class="btn btn-danger btn-sm cancel" delete_id="{{ user_obj.pk }}">删除</a>
                            </td>
                        </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</div>

<script>
    $('.cancel').click(function () {
        var $btn = $(this);
        swal({
          title: "你确定要删吗?",
          text: "请谨慎选择！！!",
          type: "warning",
          showCancelButton: true,  // 是否显示取消按钮
          confirmButtonClass: "btn-danger",  // 确认按钮的样式类
          confirmButtonText: "确认删除!",  // 确认按钮文本
          cancelButtonText: "取消删除!",  // 取消按钮文本
          closeOnConfirm: false,   // 点击确认按钮不关闭弹框
          showLoaderOnConfirm: true   // 显示正在删除的动画效果
        },
        function(){
            $.ajax({
                url:'',
                type:'post',
                data:{'delete_id':$btn.attr('delete_id')},
                success:function (data) {
                    if (data.code==1000){
                        swal(data.msg, "数据已成功删除！！", "success");
                        // 1.直接刷新页面
                        {#window.location.reload()#}
                        // 2.通过DOM操作 实时删除
                        $btn.parent().parent().remove()  // 对这个删除的标签的父级标签进行操作，删除它的父级标签，这里是直接操作该条数据的tr标签
                    }else{
                        swal("发生了未知错误!", "Q0Q.", "info");
                    }
                }
            });

        });
    })
</script>

</body>
</html>

后端

当你是用ajax做前后端交互的时候
你可以考虑返回给前端一个大字典

from homework1018 import models
import time
from django.http import JsonResponse
def sweetajax(request):
    if request.method == 'POST':
        back_dic = {"code":1000,'msg':''}  # 定义一个空字段，记录操作，到时候直接返回给前端
        delete_id = request.POST.get('delete_id')  # 获取要删除数据的id
        models.Userinfo.objects.filter(pk=delete_id).delete()
        back_dic['msg'] = '后端:已删除！！'  # 如果删除了，就会返回这样一个字典，也代表这个字典是从后端传来的
        time.sleep(3)  # 模拟删除时间
        return JsonResponse(back_dic)
    user_queryset = models.Userinfo.objects.all()
    return render(request, 'sweetajax.html', locals())