Intro to Vuetify's v-data-table
2:39
A Simple Table
2:22
Custom Item (Column) Slots
6:39
Custom Sorting
4:33
VideoTable Component
4:49
'Tags' and 'Played' Columns
8:35
Expandable Rows
4:27
DataTable Events
7:06
Custom Search and Filtering
7:10
Dynamic Columns (abstracting VideoTable)
13:46
Review
9:31
0% done with Building Complex Data Tables with Vuetify's v-data-table and VueJS

Chapter 26 of 27 in Building VueScreencasts.com
Dynamic Columns (abstracting VideoTable)

We want to use the VideoTable Component in our Admin page, but there will have to be some changes. We don't need the Played column, we want to add an Actions column, and we want to change the spacing and number of rows.

We can accomplish that by passing in headers to the component and adding a few more props. By the end of this video you'll see how the Components you create based on v-data-table can be massively flexible, reusing whichever rows you want and ignoring the rest.

We don't do it in this video, but you could even have users selecting which rows they want to see, making the columns truly dynamic!

What do others think of VueScreencasts?
"As always thanks for the great content."
—Paurakh Sharma Humagain
"Great video as always, I really like the idea of basing the video in terms of features, as someone only looking to learn particular feature can get benefits from the video. Also, I really like you going through what we have done in the video at the end, it really helps in better understanding."
—Paurakh Sharma Humagain
"tks u so much"
—013356386
"Excellent series! Will definitively follow!"
—Lars Sørensen
Take your career to the next level