VDataTable server-side pagination page synchronization limits

VDataTable page synchronization when server-items-length decreases

Vuetifys VDataTable recalculates the total number of pages whenever the server-items-length prop changes. However, the component does not automatically reset the page prop to match the new page count. If the total item count drops while the user is on a high page index, the current page number may exceed the final available page, resulting in an empty table display.

Confirmed behavior

• The update:options event fires when server-items-length changes, but it does not contain logic to reset the page index.
• Version differences exist between Vuetify 2.x and 3.x; event naming conventions may vary (update:options vs options-update), but the core pagination reset pattern remains developer-controlled.
• No built-in mechanism synchronizes the page prop with a reduced item count; the UI may persist on an index that holds no data.

Minimal developer pattern

1. Watch the server-items-length prop for changes.
2. Compare the new total against the current page value (zero-based or one-based depending on version).
3. If the current page index is greater than or equal to the new total page count, reset the page to the first index (typically 1 or 0).
4. Emit the reset via the components input or update the parent state to trigger a re-fetch.

Verification steps: reduce server-items-length to a value that yields fewer pages than the current index and observe whether the table remains empty or the page resets. Use Vue devtools or console.log to track page prop changes in response to server-items-length updates.

Missing diagnostic: Which Vuetify major version are you using? The event name and pagination zero-based vs one-based indexing differ between 2.x and 3.x, and this affects the exact reset condition.