如何在不使用 REST 框架的情况下在 Django 和 React 应用程序中实现分页？答案

【问题标题】：How to implement pagination in a Django and React app without using the REST framework?如何在不使用 REST 框架的情况下在 Django 和 React 应用程序中实现分页？
【发布时间】：2019-11-04 04:29:53
【问题描述】：

我正在开发一个网站，其后端使用 Django，前端使用 React 开发。我想在网站中添加分页功能，但不知道在前端部分如何实现。

我想将总页数发送到 react 应用。

到目前为止，我已经在视图函数中编写了以下代码

def index(request):
    influencers = Influencer.objects.all()

    paginator = Paginator(influencers,16)
    page = request.GET.get('page')
    paged_listings = paginator.get_page(page)
    user_list = UserList.objects.all().filter(user_id = request.user.id)

    queryset = list(chain(paged_listings,user_list),paginator.count)
    ser_query = serializers.serialize('json', queryset)
    return HttpResponse(ser_query)

另外我没有使用 REST 框架来开发后端站点。

我想知道我必须向 React 前端站点发送哪些信息才能使其正常工作。我应该如何进行？

【问题讨论】：

标签： python django reactjs django-pagination

【解决方案1】：

我建议您使用 django-rest-framework，因为分页可能更容易。

但是，如果您想避免传递自己的结构（显然，您可能需要传递其他信息，例如下一页/上一页等）。

这里的挑战是确保所有内容都是 JSON 可序列化的 - 这意味着对于 Queryset，您必须使用 .values() 并使用 list() 包装结果。对于Paginator，您需要使用 list() 进行包装。

from django.http.response import JsonResponse

def index(request):
    influencers = Influencer.objects.all().values()

    paginator = Paginator(influencers,16)
    page = request.GET.get('page')
    paged_listings = paginator.get_page(page)
    user_list = UserList.objects.all().filter(user_id = request.user.id).values()

    queryset = list(chain(paged_listings,user_list),paginator.count)
    content = {'total_page_count': paginator.num_pages, 'data': queryset}
    return JsonResponse(content)

【讨论】：

给出列表没有属性values()的错误。可能是因为查询集本身就是一个列表。
Influencer 模型中有很多文件，我无法显示。