Table enhancement with the thousands of data rendering

vue-table-virtual

Table enhancement with the thousands of data rendering: add common table body with Reflow, requestAnimationFrame and virtual scroll enhancement.

Build Setup

# install dependencies
npm install

# serve with hot reload at localhost:7777
npm run dev

# build for production with minification
npm run build

Table Config

• columnsConfig: require property, Each column config
• data: table data.
• filters(TBC): to filter table data.
• renderType (default: common): display table body render type,VIRTUAL -> virtual scroll body; ANIMATION -> use window.requestAnimationFrame to render body with frame scroll.
• recordKey: require property to optimize the table body to reuse the DOM elements.
• height (default: 400): display height of the table in integer number, including header and body.
• headerHeight (default: 40): display height of the header in integer number.
• recordHeight (default: 36): display height of the items in integer number.For virtual body scroll render,it used to calculate the scroll height and position.

GitHub