Load more with drf pagination

A

24 Jun 2024

load-more-with-drf-pagination
from rest_framework.pagination import PageNumberPagination

qs = Posts.objects.filter(customer=customer).order_by('-id')
paginator = PageNumberPagination()
paginator.page_size = request.GET.get('page_size', 20)
result_page = paginator.paginate_queryset(qs, request)
data= CustomerTransactionSerializer(result_page, many=True).data
return paginator.get_paginated_response(data)

<UButton @click="loadMore(posts.next)" v-if="posts && posts.next" icon="i-heroicons-plus-small-20-solid" size="md" color="primary" variant="solid" label="Load More" :trailing="true"/>

const loadMore = async(url)=>{
		url = url.split('/api/')
		url = '/api/'+url[1]
		const res = await Api.get(url)
		posts.value.results = [...posts.value.results, ...res.data.results]
		posts.value.next = res.data.next
	}
All Posts
ufw for nginx ufw-for-nginx
SEO
A

31 May 2024

Linux commands for project setuplinux-commands-for-project-setup
Web Development
A

31 May 2024

Virtual env, linux user

red teamwhat-is-red-team-in-cyber-security
Technology
A

31 May 2024

The red team in cyber security is a group of experts who test an organization's defenses by simulating real-world cyber attacks.

Similarities and Differences Between Next.js vs Nuxt.jsexploring-the-similarities-and-differences-between-nextjs-vs-nuxtjs
Web Development
A

26 Feb 2024

Next.js and Nuxt.js stand out as popular options, both offering powerful features and streamlined workflows. While sharing some core simila...