e8-table-body
Updated on Sep 18, 2025 7 minutes to readA table body component with optional drag-and-drop support, designed to be used inside e8-table.
Overview
e8-table-body renders the <tbody> section of a table within e8-table, with optional drag-and-drop support for table rows.
It provides v-model binding for reactive row data and supports configurable draggable handles, groups, and containers.
Properties
| Property | Description | Type | Default |
|---|---|---|---|
| draggable | Enables drag-and-drop for table rows if set to true. | boolean | false |
| draggable-container | CSS selector of the container for drag operations. | string | — |
| draggable-group | Name or object representing a drag group for rows. | string | object | — |
| draggable-handle | CSS selector for the drag handle inside each row. | string | — |
| v-model | Two-way bound array of table row values. | array | [] |
Slots
| Slot | Description |
|---|---|
| default | Table rows (<e8-table-row>) go here. |
Events
| Event | Description | Arguments (in order) |
|---|---|---|
| on-drag | Called with draggable enabled after a row is moved, added from another list, or removed to another list. | action: 'moved' | 'added' | 'removed', value: any[], element: any, fromIndex: number | null, toIndex: number | null, oldValue: any[] |
| on-start | Forwarded when row dragging begins, with draggable enabled. | fromIndex: number |
| on-end | Forwarded when row dragging ends, with draggable enabled. | fromIndex: number, toIndex: number |