https://github.com/ja-plus/stk-table-react
Use react to implement stk-table-vue
https://github.com/ja-plus/stk-table-react
react virtual-list
Last synced: 11 days ago
JSON representation
Use react to implement stk-table-vue
- Host: GitHub
- URL: https://github.com/ja-plus/stk-table-react
- Owner: ja-plus
- License: mit
- Created: 2026-07-23T03:33:56.000Z (18 days ago)
- Default Branch: main
- Last Pushed: 2026-07-23T14:18:13.000Z (17 days ago)
- Last Synced: 2026-07-23T16:06:26.040Z (17 days ago)
- Topics: react, virtual-list
- Language: TypeScript
- Homepage: https://ja-plus.github.io/stk-table-react/
- Size: 1.5 MB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
Stk Table React
High performance realtime virtual table for React.
Rewrote [stk-table-vue](https://github.com/ja-plus/stk-table-vue) using React
## Documentation
### [Stk Table React Official](https://ja-plus.github.io/stk-table-react/)
### [Stk Table Vue Official](https://ja-plus.github.io/stk-table-vue/)
### [Stk Table Svelte Official](https://ja-plus.github.io/stk-table-svelte/)
### [Stk Table Solid Official](https://ja-plus.github.io/stk-table-solid/)
## Features
- Virtual scrolling (vertical / horizontal / variable row height)
- Fixed columns & fixed header (based on `position: sticky`)
- Sort, multi-sort, custom sort
- Tree data, expand row
- Multi-level header
- Cell merging
- Highlight rows / cells
- Column resize, column drag reorder, row drag reorder
- Area selection
- Custom cells
- Full TypeScript types
## Install
```bash
pnpm add stk-table-react
```
## Usage
```tsx
import { StkTable } from 'stk-table-react';
import type { StkTableColumn } from 'stk-table-react';
import 'stk-table-react/lib/style.css';
type Data = {
name: string;
age: number;
address: string;
};
const columns: StkTableColumn[] = [
{ title: 'Name', dataIndex: 'name' },
{ title: 'Age', dataIndex: 'age' },
{ title: 'Address', dataIndex: 'address' },
];
const dataSource: Data[] = [
{ name: 'Jack', age: 18, address: 'Beijing' },
{ name: 'Tom', age: 20, address: 'Shanghai' },
];
function App() {
return ;
}
```
## Development
```bash
pnpm install
pnpm dev # start dev playground
pnpm test # run vitest
pnpm build # build library to lib/
pnpm docs:dev # start vitepress docs
```
## License
MIT