使用django+drv+axios+vue构建系统

在你的项目架构中,POST方式传递查询参数时,参数通常放在请求体(body)中,Django REST framework(DRF)可以通过多种方式接收处理。以下是详细的实现方案:

一、前端Axios POST请求传递参数

前端通过Axios发送POST请求时,将页码、页面大小及其他查询参数放入请求体:

javascript 复制代码
// Vue组件中示例
async fetchData() {
  try {
    const params = {
      page: 1,        // 页码
      page_size: 10,  // 页面大小
      keyword: '搜索关键词',
      status: 1       // 其他筛选条件
    };
    const response = await this.$axios.post('/api/data-list/', params);
    this.dataList = response.data.results;
    this.total = response.data.count;
  } catch (error) {
    console.error('请求失败:', error);
  }
}

二、后端DRF接收POST参数的方式

方式1:使用Request.data直接获取

DRF的Request对象会自动解析请求体中的JSON数据,可直接通过request.data获取:

python 复制代码
# views.py
from rest_framework.views import APIView
from rest_framework.response import Response
from rest_framework.pagination import PageNumberPagination

class DataListView(APIView):
    def post(self, request):
        # 获取分页参数
        page = request.data.get('page', 1)
        page_size = request.data.get('page_size', 10)
        
        # 获取其他查询参数
        keyword = request.data.get('keyword', '')
        status = request.data.get('status', None)
        
        # 构建查询集
        queryset = YourModel.objects.all()
        if keyword:
            queryset = queryset.filter(name__icontains=keyword)
        if status is not None:
            queryset = queryset.filter(status=status)
        
        # 手动分页
        paginator = PageNumberPagination()
        paginator.page_size = page_size
        paginated_queryset = paginator.paginate_queryset(queryset, request)
        serializer = YourModelSerializer(paginated_queryset, many=True)
        
        return paginator.get_paginated_response(serializer.data)
方式2:使用序列化器验证参数

通过DRF序列化器对请求参数进行验证和解析,更规范且便于处理复杂参数:

python 复制代码
# serializers.py
from rest_framework import serializers

class DataListQuerySerializer(serializers.Serializer):
    page = serializers.IntegerField(default=1, min_value=1)
    page_size = serializers.IntegerField(default=10, min_value=1, max_value=100)
    keyword = serializers.CharField(required=False, allow_blank=True)
    status = serializers.IntegerField(required=False, allow_null=True)

# views.py
class DataListView(APIView):
    def post(self, request):
        # 验证参数
        query_serializer = DataListQuerySerializer(data=request.data)
        if not query_serializer.is_valid():
            return Response(query_serializer.errors, status=400)
        
        # 获取验证后的参数
        validated_data = query_serializer.validated_data
        page = validated_data['page']
        page_size = validated_data['page_size']
        keyword = validated_data.get('keyword', '')
        status = validated_data.get('status')
        
        # 业务逻辑处理(同方式1)
        # ...
方式3:自定义分页类适配POST参数

若需全局统一处理POST分页参数,可自定义分页类:

python 复制代码
# pagination.py
from rest_framework.pagination import PageNumberPagination

class PostPageNumberPagination(PageNumberPagination):
    def get_page_number(self, request, paginator):
        # 从POST数据中获取页码
        page_number = request.data.get(self.page_query_param, 1)
        return page_number
    
    def get_page_size(self, request):
        # 从POST数据中获取页面大小
        page_size = request.data.get(self.page_size_query_param, self.page_size)
        return page_size

# views.py
class DataListView(APIView):
    pagination_class = PostPageNumberPagination
    
    def post(self, request):
        # 获取其他查询参数
        keyword = request.data.get('keyword', '')
        queryset = YourModel.objects.filter(name__icontains=keyword)
        
        # 使用分页器
        paginator = self.pagination_class()
        paginated_queryset = paginator.paginate_queryset(queryset, request)
        serializer = YourModelSerializer(paginated_queryset, many=True)
        
        return paginator.get_paginated_response(serializer.data)

三、路由配置

python 复制代码
# urls.py
from django.urls import path
from .views import DataListView

urlpatterns = [
    path('api/data-list/', DataListView.as_view(), name='data-list'),
]

四、注意事项

  1. Content-Type :Axios默认以JSON格式发送POST数据(Content-Type: application/json),DRF会自动解析request.data。若使用表单格式(application/x-www-form-urlencoded),需用request.POST获取参数。
  2. 参数验证:建议使用序列化器验证参数,避免非法参数导致错误。
  3. 分页兼容性 :若同时支持GET和POST,可在分页类中兼容两种参数获取方式(优先从request.data,其次从request.query_params)。

通过以上方式,后端可灵活接收POST请求中的查询参数及分页参数,结合DRF的序列化和分页功能实现高效的数据查询。

相关推荐
LDG_AGI2 小时前
【推荐系统】深度学习训练框架(六):PyTorch DDP(DistributedDataParallel)数据并行分布式深度学习原理
人工智能·pytorch·分布式·python·深度学习·算法·spark
背心2块钱包邮2 小时前
第24节——手搓一个“ChatGPT”
人工智能·python·深度学习·自然语言处理·transformer
执笔论英雄2 小时前
【大模型推理】小白教程:vllm 异步接口
前端·数据库·python
炒毛豆2 小时前
vue3+ant design vue实现表单验证失败后,自动滚动到失败的位置(scrollToField)
前端·javascript·vue.js
l***77522 小时前
Vue项目中 安装及使用Sass(scss)
vue.js·sass·scss
databook2 小时前
Manim v0.19.1 发布啦!三大新特性让动画制作更丝滑
后端·python·动效
fruge2 小时前
Vue3 实战避坑:10 个 Composition API 高频错误及修复方案
前端·javascript·vue.js
8***23552 小时前
SQL Server2022版+SSMS安装教程(保姆级)
后端·python·flask
Sally_xy3 小时前
Python 虚拟环境
开发语言·chrome·python
J总裁的小芒果3 小时前
el-table 假数据合并
javascript·vue.js·elementui