前后端分离的项目---多表数据展示,过滤,分页实现过程

本文详细介绍了在前后端分离的项目中,如何实现多表数据的展示、过滤和分页功能。后端使用Django,通过ListAPIView、filter_fields和pagination_class实现接口,前端利用Vue.js和element-ui完成分页和过滤操作。
摘要由CSDN通过智能技术生成

问题:

在前后端分离的项目中,涉及到多表数据展示,过滤,分页的实现过程

解决办法:

一、后端接口的实现

1.路由(urls文件):

from django.urls import path
from . import views
urlpatterns = [
    path(r"category/", views.CourseCategoryListAPIView.as_view()),
    path(r"courses/", views.CourseListAPIView.as_view()),
]

2.视图

因为只涉及数据的展示,故继承ListAPIView,指定查询集和序列化器
过滤:添加属性filter_fields;分页:添加属性pagination_class。关于过滤和分页的详解:移步另一篇博客

from rest_framework.generics import ListAPIView
from . import models
from .serializers import CourseCategoryModelSerializer, CourseListModelSerializer
from .pagenations import LargeResultsSetPagination


class CourseCategoryListAPIView(ListAPIView):
    """
    课程分类
    """
    queryset = models.CourseCategory.objects.filter(is_show=True, is_deleted=False).order_by("orders", "-id")
    serializer_class = CourseCategoryModelSerializer


class CourseListAPIView(ListAPIView):
    """
    课程列表
    """
    queryset = models.Course.objects.filter(is_deleted=False, is_show=True).order_by('id')  # 可以按id倒序
    serializer_class = CourseListModelSerializer
    # 可按字段course_category过滤,前端发请求时www.xxxx/xx/?course_category=1可拿到course_category=1的数据
    filter_fields = ('course_category',) 
    # 需要自定义类LargeResultsSetPagination继承PageNumberPagination
    pagination_class = LargeResultsSetPagination

关于过滤:
1)需要安装dja

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值