如何使中继器项目计数动态Laravel Filament V3

发布于04月10日

在Laravel Filament我想增加或减少重复项目的数量改变值count InputText. live()方法在这种情况下是不react 的.

TextInput::make('count')->numeric()->live()->default(3),
Repeater::make('installments')
->schema([
    TextInput::make('amount')->numeric()->placeholder('Installment Amount')->hiddenLabel(),
    TextInput::make('interval')->numeric()->placeholder('Interval')->hiddenLabel(),
    Select::make('interval_unit')->hiddenLabel()->placeholder('Interval Unit'),
])
->defaultItems(function (Get $get) {
     return $get('count');
  })
  ->hiddenLabel()->deletable(false)
  ->addable(false)->columnSpan(3)->reorderable(false)->columns(3)

在初始加载中，它显示3个项目，默认值count是3，但更改文本输入字段中的值count不会改变重复器项目的数量.

如何使此中继器项目动态化？

推荐答案

我会这样做:

TextInput::make('count')
    ->numeric()
    ->live()
    ->default(3)
    ->minValue(0)
    ->afterStateUpdated(function (Set $set, Get $get, ?int $state, ?int $old): void {
        if (is_null($state)) {
            $set('installments', []);
            return;
        }

        $installments = $get('installments');
        $itemsToBeAdded = $state - $old;

        if ($itemsToBeAdded > 0) {
            for ($i = 0; $i < $itemsToBeAdded; $i++) {
                $installments[] = [];
            }
        } else if ($itemsToBeAdded < 0) {
            for ($i = 0; $i < abs($itemsToBeAdded); $i++) {
                array_pop($installments);
            }
        }

        $set('installments', $installments);
    }),
Repeater::make('installments')
    ->schema([
        TextInput::make('amount')->numeric()->placeholder('Installment Amount')->hiddenLabel(),
        TextInput::make('interval')->numeric()->placeholder('Interval')->hiddenLabel(),
        Select::make('interval_unit')->hiddenLabel()->placeholder('Interval Unit'),
    ])
    ->defaultItems(function (Get $get) {
        return $get('count');
    })
    ->hiddenLabel()
    ->deletable(false)
    ->addable(false)
    ->columnSpan(3)
    ->reorderable(false)
    ->columns(3),

我改变了什么？

我添加了afterStateUpdated函数，在这里我检索count和installments的当前状态(使用$get)，并计算是否需要添加或删除一个项目(使用$set).
最后但并非最不重要的是，不要通过链接->minValue(0)行来使count的minValue小于0.

Docs: