如何使用livewire更新表中的子组件？

<?php

namespace App\Http\Livewire;

use Livewire\Component;

class TableComponent extends Component
{
    public $data = [
        ['id' => 1, 'name' => 'John'],
        ['id' => 2, 'name' => 'Jane'],
        // ...
    ];

    public function updateData($id)
    {
        // 更新数据逻辑
        // ...

        // 向子组件发送自定义事件，并传递需要更新的数据
        $this->emit('dataUpdated', $updatedData);
    }

    public function render()
    {
        return view('livewire.table-component');
    }
}

<?php

namespace App\Http\Livewire;

use Livewire\Component;

class RowComponent extends Component
{
    public $rowData;

    protected $listeners = ['dataUpdated'];

    public function dataUpdated($updatedData)
    {
        // 更新子组件的数据
        $this->rowData = $updatedData;
    }

    public function render()
    {
        return view('livewire.row-component');
    }
}

<div>
    <table>
        <thead>
            <tr>
                <th>ID</th>
                <th>Name</th>
                <th>Action</th>
            </tr>
        </thead>
        <tbody>
            @foreach ($data as $row)
                <livewire:row-component :rowData="$row" :key="$row['id']" />
            @endforeach
        </tbody>
    </table>
</div>

<tr>
    <td>{{ $rowData['id'] }}</td>
    <td>{{ $rowData['name'] }}</td>
    <td>
        <button wire:click="updateData({{ $rowData['id'] }})">Update</button>
    </td>
</tr>