Laravel中如何使用Repeater在子组件中渲染数据

问题根源 #

Filament框架里，form()方法的执行时机比mount()早。你在mount()中给$this->array赋值，但此时form()已经完成了子组件的初始化，传给DisplayForm::make()的$this->array还是初始的null，这就是子组件日志显示数据为空的原因。

解决方案 #

1. 调整父组件数据传递时机 #

不需要在mount()里中转数据，直接在form()中从$record读取目标数组，因为form()方法可以直接访问$this->record：

public function form(Form $form): Form
{
    return $form
        ->schema([
            DisplayForm::make($this->record->some_array),
        ]);
}

// 保留mount方法用于日志或其他逻辑（可选）
public function mount($record): void
{
    $this->record = $record;
    Log::info('data', ['data' => $this->record->some_array]);
}

2. 修正子组件Repeater初始化逻辑 #

子组件里不用依赖afterStateHydrated来设置状态，直接用default()方法传递初始数据即可：

public static function make(array $data): Component
{
    Log::info('data', ['data' => $data]); // 现在能正常获取数据
    return Repeater::make('conditions')
        ->schema([
            TextInput::make('array_key_1')
                ->label('字段1'),
            TextInput::make('array_key_2')
                ->label('字段2'),
        ])
        ->default($data)
        ->reorderable();
}

进阶优化：直接绑定模型字段（编辑场景） #

如果你的some_array是模型的JSON字段，更简洁的做法是让Repeater直接绑定该字段，Filament会自动处理数据的读取和保存，无需自定义子组件：

public function form(Form $form): Form
{
    return $form
        ->schema([
            Repeater::make('some_array')
                ->schema([
                    TextInput::make('array_key_1')
                        ->label('字段1'),
                    TextInput::make('array_key_2')
                        ->label('字段2'),
                ]),
        ]);
}

内容的提问来源于stack exchange，提问作者ang