如何在 Laravel 中使用中继器渲染子组件中的数据

Question

我在 Laravel 应用程序中有一个父组件和子组件，并且想为数组中的每个元素渲染一个

TextInput

。

但是，我在将数据从父级传递给子级时遇到问题。根据日志的行为方式，这似乎是一个生命周期问题，但我不确定。

如何在组件之间传递数据并将数据显示在页面上？

[{
    "array_key_1": "text 1",
    "array_key_2": "text 2",
}, {
    "array_key_1": "text 3",
    "array_key_2": "text 4",
}]

家长

public function mount($record): void
    {
        $this->array = $this->record->some_array;
        Log::info('data', $data); // returns values
    }

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

显示表格

  public static function make(array $data): Component
  {
    Log::info('data', $data); // returns null
    return Repeater::make('conditions')
      ->schema([
        TextInput::make('array_key_1')
          ->label('array_key_1'),
        TextInput::make('array_key_2')
          ->label('array_key_2'),
      ])
      ->defaultItems(count($data))
      ->afterStateHydrated(function (Repeater $component, $state) use ($data) {
        $component->state($data);
      });
  }

Answer 1

将数据分配移至表单方法中可以解决此问题。

public function form(Form $form): Form
{
    $this->array = $this->record->some_array;

    return $form
        ->schema([
              DisplayForm::make($this->array);
        ])
}