Table - Custom Slot Templates

Insert custom content at different positions of the table through slots, such as toolbar above the table, left/right action areas, etc.

Custom Left Template

Place action buttons and search boxes in the left area above the table through the #toolbar-left slot. This is the most commonly used toolbar slot.

Index	Name	Age	Department	Status	Address

1	John	28	Engineering	Active	Chaoyang, Beijing
2	Jane	32	Product	Active	Pudong, Shanghai
3	Mike	25	Design	Inactive	Tianhe, Guangzhou
4	Sarah	35	Operations	Active	Nanshan, Shenzhen

Custom Left Template

Custom Left Prefix Template

Insert content before the left action buttons through the #toolbar-left-prefix slot, such as titles, icons, etc.

📋 Employee List

Name	Age	Department	Status	Address

John	28	Engineering	Active	Chaoyang, Beijing
Jane	32	Product	Active	Pudong, Shanghai
Mike	25	Design	Inactive	Tianhe, Guangzhou
Sarah	35	Operations	Active	Nanshan, Shenzhen

Custom Left Prefix Template

Custom Left Suffix Template

Append content after the left action buttons through the #toolbar-left-suffix slot, such as data statistics.

Total 4 records

Name	Age	Department	Status	Address

John	28	Engineering	Active	Chaoyang, Beijing
Jane	32	Product	Active	Pudong, Shanghai
Mike	25	Design	Inactive	Tianhe, Guangzhou
Sarah	35	Operations	Active	Nanshan, Shenzhen

Custom Left Suffix Template

Custom Right Template

Place action buttons on the right side above the table through the #toolbar-right slot, such as refresh, export, print, settings, etc.

Name	Age	Department	Status	Address

John	28	Engineering	Active	Chaoyang, Beijing
Jane	32	Product	Active	Pudong, Shanghai
Mike	25	Design	Inactive	Tianhe, Guangzhou
Sarah	35	Operations	Active	Nanshan, Shenzhen

Custom Right Template

Custom Right Prefix Template

Insert content before the right action buttons through the #toolbar-right-prefix slot, such as status hints.

⚠️ 1 pending review

Name	Age	Department	Status	Address

John	28	Engineering	Active	Chaoyang, Beijing
Jane	32	Product	Active	Pudong, Shanghai
Mike	25	Design	Inactive	Tianhe, Guangzhou
Sarah	35	Operations	Active	Nanshan, Shenzhen

Custom Right Prefix Template

Custom Right Suffix Template

Append content after the right action buttons through the #toolbar-right-suffix slot, such as sync status.

✅ Synced

Name	Age	Department	Status	Address

John	28	Engineering	Active	Chaoyang, Beijing
Jane	32	Product	Active	Pudong, Shanghai
Mike	25	Design	Inactive	Tianhe, Guangzhou
Sarah	35	Operations	Active	Nanshan, Shenzhen

Custom Right Suffix Template

Full Toolbar Example

Combine all 6 toolbar slots to build a complete table toolbar layout.

📋 Employee Management

Total 4 people

Index	Name	Age	Department	Status	Address

1	John	28	Engineering	Active	Chaoyang, Beijing
2	Jane	32	Product	Active	Pudong, Shanghai
3	Mike	25	Design	Inactive	Tianhe, Guangzhou
4	Sarah	35	Operations	Active	Nanshan, Shenzhen

Full Toolbar

Slot Layout Description

The toolbar area is divided into left and right sections, each with 3 slot positions:

┌──────────────────────────────────────────────────────────────────┐
│ [left-prefix] [left] [left-suffix]   [right-prefix] [right] [right-suffix] │
├──────────────────────────────────────────────────────────────────┤
│                        Table Content Area                             │
└──────────────────────────────────────────────────────────────────┘

API

Toolbar Slots

Slot	Description	Position
toolbar-left	Left toolbar main content	Left
toolbar-left-prefix	Left toolbar prefix (e.g., title)	Left start
toolbar-left-suffix	Left toolbar suffix (e.g., statistics)	Left end
toolbar-right	Right toolbar main content	Right
toolbar-right-prefix	Right toolbar prefix (e.g., hints)	Right start
toolbar-right-suffix	Right toolbar suffix (e.g., status)	Right end
empty	Custom empty data state content	Inside table

Usage Tips

1. Left side typically holds action buttons: add, batch delete, search, etc.
2. Right side typically holds tool buttons: refresh, export, print, column settings, etc.
3. Prefix is suitable for static content like titles and icons
4. Suffix is suitable for auxiliary info like statistics and status indicators
5. All slots can be freely combined; unused slots won't render extra space