Notifications
See all
  • Alice C. left a comment.

    1 hour ago

  • Joshua S. uploaded a file.

    2 hours ago

  • Tara S. sent you a message.

    2 hours ago

  • Melany W. left a comment.

    3 hours ago

Erik KovalskyProduct Manager
ProfileView your profile

ProjectsAll my projects
TeamManage your team

SettingsAccount settings

  • Erik KovalskyProduct Manager
    ProfileView your profile

    ProjectsAll my projects
    TeamManage your team

    SettingsAccount settings

  • Erik KovalskyProduct Manager
    ProfileView your profile

    ProjectsAll my projects
    TeamManage your team

    SettingsAccount settings

Components

  • Components Hub
  • Colors
  • Helpers
  • Content
  • Table
  • Icons
  • Interaction
  • VDropdown
  • VLoader
  • VPlaceload
  • VPlaceloadText
  • VPlaceloadAvatar
  • VMessage
  • VModal
  • VProgress
  • VTootlip
  • Buttons
  • Forms
  • Switches
  • Display
  • VAvatar
  • VAvatarStack
  • VBlock
  • VIconBox
  • VIconWrap
  • VSnack
  • VTag
  • VFlex
  • VGrid
  • VBreadcrumb
  • VTabs
  • VFlexPagination
  • VFlexTable
  • Accordions
  • Cards
  • Placeholders
  • Addons

Notifications
See all
  • Alice C. left a comment.

    1 hour ago

  • Joshua S. uploaded a file.

    2 hours ago

  • Tara S. sent you a message.

    2 hours ago

  • Melany W. left a comment.

    3 hours ago

  • Components
  • VFlexTable
  • VFlexTableWrapper

VFlexTableWrapper

You can wrap <VFlexTable /> using <VFlexTableWrapper /> to render large amount of data. This will also enable sorting, searching and paginating through the data. Instead of providing data and columns properties to <VFlexTable />, you just have to declare them to <VFlexTableWrapper />.

In addition to the base columns settings, searchable, sortable attributes can be used to enable search and sorting. Of course, custom sort and filter function can be used. To easily customize your table, <VFlexPagination />, <VFlexTableToolbar> and <VFlexTableSortColumn> components can be used to display controls for pagination and search.

Check the markup for more details about usage.

UsernameLocationRole
Tara S.This is a nice user description that we can use as demo content.
New York, NY
UI/UX Designer
Helmut F.This is a nice user description that we can use as demo content.
Paris, France
Product Manager
Melany W.This is a nice user description that we can use as demo content.
San Jose, CA
Web Developer
Hakeem C.This is a nice user description that we can use as demo content.
Berlin, Germany
Software Engineer
Alejandro B.This is a nice user description that we can use as demo content.
New York, NY
Business Analyst
Jeanne M.This is a nice user description that we can use as demo content.
Paris, France
Mobile Developer
Greta K.This is a nice user description that we can use as demo content.
Berlin, Germany
Sales Manager
Ana B.This is a nice user description that we can use as demo content.
San Francisco, CA
UI/UX Designer
Mary L.This is a nice user description that we can use as demo content.
San Diego, CA
Project Manager
Jonathan K.This is a nice user description that we can use as demo content.
Los Angeles, CA
Product Manager
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • …
  • 1800

<VFlexTableWrapper> Props

NameDefaultType
:columns
:data
:debounce-search
:limit
:page
:search-term
:sort
:total

<VFlexTableWrapper> Exposed

NameType
onUpdate:limit
onUpdate:page
onUpdate:searchTerm
onUpdate:sort

<VFlexTableWrapper> Slots

NameType
#default