gitmyhub

vxe-table

TypeScript ★ 8.6k updated 19h ago

vxe table 支持 vue2, vue3 的表格解决方案

vxe-table is a Vue 2 and Vue 3 component for displaying and editing large amounts of tabular data in web apps, with virtual scrolling that handles millions of rows, Excel-like keyboard navigation, drag-and-drop columns, and multi-column sorting.

TypeScriptVueJavaScriptsetup: moderatecomplexity 3/5

vxe-table is a feature-rich table and data grid component for Vue 2 and Vue 3 web applications. It is aimed at business applications that need to display and edit large amounts of tabular data, similar to what you might do in a spreadsheet but embedded inside a web page.

The core free version covers a wide range of common table needs: fixed columns, multi-level headers, row and column drag-and-drop reordering, sorting across multiple fields at once, filtering, cell merging, row grouping, expandable rows, and a virtual tree mode. You can show a loading state, format cell content, add custom slot templates, and configure a toolbar with export, import, and print options. Keyboard navigation is supported so users can move through cells without a mouse.

For handling large datasets, vxe-table uses virtual scrolling, which renders only the rows visible on screen rather than the full dataset. Recent versions have been tuned to handle millions of rows without the page becoming slow. An undo-and-redo system was added in recent releases for tracking add, edit, and delete operations.

An enterprise edition adds additional features including cell area selection, Excel-style copy and paste across cells, find and replace, aggregate functions, data summaries, and integrated charting. These are sold separately through the project's store.

Both a basic and a table-specific documentation site are provided online in Chinese, along with a Gantt chart extension. The component is installed via npm and works with both the Composition API and Options API styles of Vue. An English README is available in the repository alongside the default Chinese one.

Where it fits