行不使用Livewire删除，只是从行中删除数据

Question

我创建了一个动态行，我想删除该行，但仅删除该行中的数据并且不更新输入字段。我在此使用 livewire 来创建行和删除行。 输入字段的 ui 未删除。

我已经尝试过，但这只会从行中删除数据。

这是按钮代码。 公共函数removeRow($index){ array_splice($this->createChallanRequest['order_details'], $index, 1);}

Answer 1

我假设您正在使用循环来显示行。为了让 Livewire 了解要在 DOM 中更新哪些行，您需要为每行提供唯一的 wire:key 属性：

@foreach ($users as $user)
    <div wire:key="'user-{{ $user->id }}">
        User name: {{ $user->name }}
    </div>
@endforeach

在此示例中，我使用带有前缀的记录 ID（如果同一页面上有多个列表，则很有用）作为 wire:key

如果您正在显示一个数组并且行中没有唯一的 id，则可以使用数组索引，但您必须确保它不会被回收（或者当您更改行时也不会在对它们进行分页时）：

@foreach ($order_details as $key => $order_detail)
    <div wire:key="prefix-{{ $key }}">
        .....
    </div>
@endforeach

因此，当您删除一行时，您不能使用 splice() 来实现此目的，因为它会压缩索引。您可以使用简单的 unset() 来删除行，但保留索引不变：

public function removeRow($index){ 
   unset ($this->createChallanRequest['order_details'][$index]);
}