开始
概述
Filament 表格构造器允许你添加交互式数据表到 Livewire 组件。它也用在其他 Filament 包中,比如在面板构造器中展示资源和关联管理器,以及表格 widget。了解表格构造器的特性将能极大节省创建自定义 Livewire 表格和使用其他 Filament 包的时间。
本教程将带你一起了解通过 Filament 表格构造器创建表格的基础。如果你计划将新表单添加到自己的 Livewire 组件,你可以先添加完表格,再回来。如果你要将表格添加到应用资源或者其他 Filament 包中,可以开始了!
定义表格列
表格的基础是行和列。Filament 使用 Eloquent 获取表格的行数据,由你负责定义该行中使用的列字段。
Filament 中由许多预构建的列字段类型,此处查看可用字段完整清单。你也可以创建自定义类字段类型。
列字段以 $table->columns()
方法中的对象的方式,保存在数组中:
use Filament\Tables\Columns\IconColumn;
use Filament\Tables\Columns\TextColumn;
use Filament\Tables\Table;
public function table(Table $table): Table
{
return $table
->columns([
TextColumn::make('title'),
TextColumn::make('slug'),
IconColumn::make('is_featured')
->boolean(),
]);
}
本例中,表格中有三个列字段。前两个展示文本 - 表格中每行的标题和 slug。第三列展示图标,显示绿色的打勾或者红色的打叉。
使列字段可排序和可搜索
使用链式调用方法可以轻松修改列字段。比如,你可以使用 searchable()
将列字段设为可搜索。现在,表格中将有一个搜索字段,你可以使用该列的值过滤行数据:
use Filament\Tables\Columns\TextColumn;
TextColumn::make('title')
->searchable()
您可以让多个列可搜索,Filament 将能够同时搜索其中任何一个列中的匹配项。
使用 sortable()
方法,你也可以让字段列可排序。这将会在列首添加一个排序按钮,点击会使之按照该列对表格进行排序:
use Filament\Tables\Columns\TextColumn;
TextColumn::make('title')
->sortable()
从列中访问关联数据
你也可以在列中展示关联数据。比如,如果 Post
模型,其关联 User
模型(文章的作者),你可以在表格中展示用户名:
use Filament\Tables\Columns\TextColumn;
TextColumn::make('author.name')