如何通过Livewire子组件Checkboxs更新父组件MyForm的属性？

要实现Checkboxs组件的变化实时更新MyForm中的$selectedA和$selectedB，只需遵循Livewire的双向绑定规范调整Checkboxs组件即可，具体修改如下：

1. 优化Checkboxs组件类 #

无需手动触发事件，确保组件的$value属性正确响应变化，Livewire会自动处理双向绑定逻辑：

class Checkboxs extends Component
{
    public $title;
    public $items = [];
    // 用于双向绑定的核心属性，与父组件wire:model自动关联
    public $value = [];

    // 可选：若需在value变化时执行自定义逻辑，可添加updated钩子
    public function updatedValue($newValue)
    {
        // 此处可添加验证、数据格式化等自定义操作
        // Livewire会自动将新值同步回父组件的绑定属性
    }
}

2. 修正Checkboxs组件视图代码 #

移除手动编写的@input="$emit('input', ...)"，wire:model="value"会自动完成事件传递：

<div>
    <div>
        <div>{{ $title }}</div>
    </div>
    <div>
        @foreach($items as $item)
            <label>
                <input type="checkbox" wire:model="value" value="{{ $item->id }}">
                {{ $item->name }}
            </label>
        @endforeach
    </div>
</div>

3. 父组件MyForm无需修改 #

你当前的MyForm组件代码已经正确使用wire:model="selectedA"和wire:model="selectedB"绑定子组件，修改完Checkboxs组件后，用户勾选/取消复选框时，$selectedA和$selectedB会自动同步更新。

原理说明 #

Livewire子组件的wire:model双向绑定逻辑：

• 父组件将绑定属性值（如selectedA）传递给子组件的$value属性
• 当子组件$value变化时，Livewire自动触发input事件，将新值传递回父组件并更新对应属性

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