Skip to main content

onchange

Description​

Fires when the current page is changed in the pager

Usage​

onchange?: (ev: { value: number; from: number; to: number }) => void;

Parameters​

The onchange handler receives a single object with the following properties:

  • value - (required) the number of the newly opened page
  • from - (required) the index of the first row on the new page
  • to - (required) the index of the last row on the new page

Example​

<script setup>
  function changeHandler(ev) {
     const newState = ev;
      console.log(newState);
      // => {value: 2, from: 20, to: 40}
  }
</script>

<template>
  <Pager :value="2" :total="100" :onchange="changeHandler" />
</template>

Details​

The handler function receives an object with the number of the newly opened page and the numbers of the start and end rows of this page.

Related article: Catching the change of the active page