_pagination

User

Post

PostItem.vue

LoadMore.vue

PostList.vue

<script setup lang="ts">
  import { useController, useLoading } from '@data-client/vue';
  import { PostResource } from './Post';

  const props = defineProps<{ cursor: string }>();
  const ctrl = useController();
  const [loadPage, isPending] = useLoading(() =>
    ctrl.fetch(PostResource.getList.getPage, { cursor: props.cursor }),
  );
</script>

<template>
  <center>
    <button @click="loadPage" :disabled="isPending">
      {{ isPending ? '...' : 'Load more' }}
    </button>
  </center>
</template>