Member-only story
Vuetify 3.4.0 With Data Table And 4 New Components
Vuetify packs Vue developers with a data table component, and four other that will blow your bosses mind!
Vuetify is a popular component library for Vue framework. The 3.4.0 version released on November 9 comes with some new components that were promoted from labs. Let’s take a look:
VBottomSheet
It shows a sliding panel on top of the app:
VDataIterator
It’s a templating component that let’s you display a list of items and style them accordingly. Here’s an example code:
<v-data-iterator :items="items" :page="page">
<template v-slot:default="{ items }">
<template
v-for="(item, i) in items"
:key="i"
>
<v-card v-bind="item.raw"></v-card>
<br>
</template>
</template>
</v-data-iterator>
VDataTable
Building a data table component is a task on itself. Vueify now has an official data table component and it offers a good range of customisation. Here’s an example with custom templates of cells:
There’s also a component for infinite scrolling, stepper and skeleton loader for these cloud based applications.
I enjoy that release and plan to update my stack. And you? Writo a commento!
Subscribe for more! Cheers!
