Actions
概述
Filament 表格可以使用 Actions。Action 是添加到表格行末或者表格头部的按钮。比如,如果你想在表格头部添加"新建"记录的 action,在每行中添加"编辑"和"删除" action。批量 action可用在记录选中时执行代码。另外,action 也可以添加到表格列,这样该列中的每个单元格都是 action 的触发器。
强烈建议阅读自定义 action 触发按钮 和 action 模态框文档,去了解 action 的全部功能。
行 action
Action 按钮可以在每个表格行的末尾进行渲染。将其放入 $table->actions()
方法中:
use Filament\Tables\Table;
public function table(Table $table): Table
{
return $table
->actions([
// ...
]);
}
Action 可以使用静态 make()
方法创建,传入其唯一名称。
然后将其传入到 action()
方法中执行任务,或者传入 url()
方法中创建链接:
use App\Models\Post;
use Filament\Tables\Actions\Action;
Action::make('edit')
->url(fn (Post $record): string => route('posts.edit', $record))
->openUrlInNewTab()
Action::make('delete')
->requiresConfirmation()
->action(fn (Post $record) => $record->delete())
Action 上的所有方法都接收回调函数,在回调函数你可以访问当前表格的记录 $record
。
将行 action 放置到列的前面
默认情况下,表格中的行 action 渲染在每一行的最后一个单元格中。你可以使用 position
参数将其移动到列的前面:
use Filament\Tables\Enums\ActionsPosition;
use Filament\Tables\Table;
public function table(Table $table): Table
{
return $table
->actions([
// ...
], position: ActionsPosition::BeforeColumns);
}
将行 action 放置到复选框列前
默认情况下,表格中的行 action 渲染在每一行的最后一个单元格中。你可以使用 position
参数将其移动到复选框列的前面:
use Filament\Tables\Enums\ActionsPosition;
use Filament\Tables\Table;
public function table(Table $table): Table
{
return $table
->actions([
// ...
], position: ActionsPosition::BeforeCells);
}
批量操作
表格也支持批量操作(bulk actions)。当用户在表格中选择多行时,可使用该 action。通常,当行被选中后,会有一个批量操作按钮显示在表格的左上角。用户点击该按钮时,它会显示一个 action 的下拉菜单供选择。你可以将批量操作放到 $table->bulkActions()
方法中:
use Filament\Tables\Table;
public function table(Table $table): Table
{
return $table
->bulkActions([
// ...
]);
}
BulkAction 可以使用静态的 make()
方法,传入唯一名称创建。然后传入一个回调到 action()
中执行任务:
use Filament\Tables\Actions\BulkAction;
use Illuminate\Database\Eloquent\Collection;
BulkAction::make('delete')
->requiresConfirmation()
->action(fn (Collection $records) => $records->each->delete())
该函数允许你访问表格当前选中的记录 $records
。它是一个 Eloquent 模型集合。
批量操作分组
使用 BulkActionGroup
对象,你可以将多个批量操作一起分组到一个下拉菜单中。BulkActionGroup
外面的批量操作将紧挨着下拉触发按钮渲染:
use Filament\Tables\Actions\BulkAction;
use Filament\Tables\Actions\BulkActionGroup;
use Filament\Tables\Table;
public function table(Table $table): Table
{
return $table
->bulkActions([
BulkActionGroup::make([
BulkAction::make('delete')
->requiresConfirmation()
->action(fn (Collection $records) => $records->each->delete()),
BulkAction::make('forceDelete')
->requiresConfirmation()
->action(fn (Collection $records) => $records->each->forceDelete()),
]),
BulkAction::make('export')->button()->action(fn (Collection $records) => ...),
]);
}
此外,如果所有批量操作都分组,你可以使用 groupedBulkActions()
方法:
use Filament\Tables\Actions\BulkAction;
use Filament\Tables\Actions\BulkActionGroup;
use Filament\Tables\Table;
public function table(Table $table): Table
{
return $table
->groupedBulkActions([
BulkAction::make('delete')
->requiresConfirmation()
->action(fn (Collection $records) => $records->each->delete()),
BulkAction::make('forceDelete')
->requiresConfirmation()
->action(fn (Collection $records) => $records->each->forceDelete()),
]);
}
批量操作完成后取消记录选择
使用 deselectRecordsAfterCompletion()
方法,你可以在批量按钮执行后取消记录选择:
use Filament\Tables\Actions\BulkAction;
use Illuminate\Database\Eloquent\Collection;
BulkAction::make('delete')
->action(fn (Collection $records) => $records->each->delete())
->deselectRecordsAfterCompletion()
某些行禁用批量操作
你可以条件性地禁用特定行的批量操作功能:
use Filament\Tables\Table;
use Illuminate\Database\Eloquent\Model;
public function table(Table $table): Table
{
return $table
->bulkActions([
// ...
])
->checkIfRecordIsSelectableUsing(
fn (Model $record): bool => $record->status === Status::Enabled,
);
}
头部 action
行 action 和批量操作都可以在表头中渲染。请将其放到 $table->headerActions()
方法中:
use Filament\Tables\Table;
public function table(Table $table): Table
{
return $table
->headerActions([
// ...
]);
}
这对于像 "create" 这种不依赖于特定表格行的 action 或者需要更为显眼的批量 action,非常有用,