Adding custom scrollbars to vuetify data tables

Viewed 2569

I am trying to add perfect-scrollbar to vuetify's data tables. So I have to wrap the data table inside the perfect-scrollbar component like this -

<perfect-scrollbar>
  <v-data-table :headers="headers" :items="data" />
</perfect-scrollbar>

The problem is that its also wrapping the data-table footer. I want to wrap only the data of table within perfect-scrollbar component. So that only data is scrollable and footer remains there.

Now it looks like this - enter image description here

1 Answers

Actually no need to use perfect-scrollbar here. You just set the height to v-data-table. Then the component automatically sets the scroll bar.

As the example,

<v-data-table :headers="headers" :items="data" height="200px"/> 

Try with it.

Related