Data table - Server side tables

Server-side Data tables are used for showing data coming from an API.


Installation

Labs components require a manual import and installation of the component.

src/plugins/vuetify.js
import { VDataTableServer } from 'vuetify/labs/VDataTable'

export default createVuetify({
  components: {
    VDataTableServer,
  },
})

Examples

Server-side paginate and sort

To use data from an API, listen to the @update:options event to know when to fetch new data. Use the loading prop to display a progress bar while fetching the data.

Loading

You can use the loading prop to indicate that data in the table is currently loading. If there is no data in the table, a loading message will also be displayed. This message can be customized using the loading-text prop or the loading slot.

Ready for more?

Continue your learning with related content selected by the Team or move between pages by using the navigation links below.
Edit this page onGitHub