Bulk Actions
批量操作
Aliases:批量操作批量处理勾选后操作多选了一起弄全选后删除bulk actionsbatch actionsmass actions
What is it
Tick many rows with checkboxes, then run one command against the whole selection at once. An action bar surfaces on selection with a count and an undo affordance. It collapses repetitive single-row clicks into one batch decision — ideal for list maintenance such as cleanup, archive, tagging and export.
Interactive playground
Try it. Make an informed choice.Loading lab…
✓ When to use
- One action must hit many rows — delete, archive, status change
- Lists are the maintenance surface — admin, inbox, asset library
- Mistakes are recoverable and undo can be offered
✕ When not to use
- Sparse per-row work — one-by-one clicking is fine
- Irreversible actions with no audit or undo — batching amplifies risk
- Narrow mobile screens where checkboxes misfire and bars crowd
Variants
Checkbox + action bar
复选框 + 操作栏
A bar appears on selection at the bottom or top — the default
Select-all + inverse
全选 + 反选
Tri-state header select-all with invert to narrow the set
Sticky footer bar
粘性底栏
Bar pinned to the viewport bottom, always reachable while scrolling
Implementation
positiontransformtransitionopacityKeep the selection as a Set or id array; the header checkbox uses indeterminate for partial selection. Slide the action bar in (translateY + opacity, durations scaled by var(--demo-speed, 1)) when the count exceeds zero. After running, show a toast with undo and respect prefers-reduced-motion. Bulk endpoints must be idempotent to survive double-submits.
Related concepts
A two-dimensional grid aligning data in rows and columns — one record per row, one field per column — built for column-by-column comparison, sorting and high-volume browsing. Rows highlight on hover and support selection; column headers usually carry sort controls.
ComponentsUsed withSquare toggles for a set of independently selectable items, flipping between checked and unchecked on click. A parent can show an indeterminate state when only some children are checked — used for bulk selection, filters and consent.
ComponentsUsed withHandles risky actions with "apply first, allow regret": deletions take effect immediately and show the result, while a snackbar with a countdown offers one-tap undo until the timer expires. Unlike confirmation dialogs it never interrupts the flow, and unlike a single confirm it leaves a real window to change one's mind.
PatternsUsed withA panel concentrating filter controls beside the list (or revealed in a drawer or popover): checkbox groups, radios and sliders compose the current query. It syncs with the list to refresh result counts, echoes selected conditions and offers clear-all.
ComponentsUsed with