开始
概述
Filament 表单不限于展示字段。你也可以使用"布局组件",将其组织成无限嵌套结构。
布局组件类在 Filament\Forms\Components
命名空间下。他们和其他表单字段一起,存放在表单 Schema 内。
组件可以使用静态 make()
方法创建。通常,你可以定义子组件的 schema
在其内部显示:
use Filament\Forms\Components\Grid;
Grid::make(2)
->schema([
// ...
])
可用布局组件
Filament 随带一些布局组件,适合于根据需要排列表单字段:
你也可以创建自定义布局组件来排列字段。
设置 ID
使用 id()
方法,你可以定义组件的 ID:
use Filament\Forms\Components\Section;
Section::make()
->id('main-section')
添加额外的 HTML 属性
你可以将额外的 HTML 属性传递给组件,这些属性会与外层 DOM 元素合并。请传递属性数值给 extraAttributes()
方法,数值键是属性值,数组值为属性值:
use Filament\Forms\Components\Group;
Section::make()
->extraAttributes(['class' => 'custom-section-style'])
类会合默认类合并,而且其他属性会覆盖默认属性。
全局设置
如果你想全局改变组件的默认行为,那么你可以在服务提供者的 boot()
方法中或者中间件里调用静态 configureUsing()
方法 。传入一个可以修改组件的闭包。比如,如果你想让所有 Section
组件默认拥有 2 列,你可以这样:
use Filament\Forms\Components\Section;
Section::configureUsing(function (Section $section): void {
$section
->columns(2);
});
当然,你仍然可以单独对每个组件重写该行为:
use Filament\Forms\Components\Section;
Section::make()
->columns(1)