Livewire 线：model.defer 在提交时显示空值（第二次）

Question

这是我的刀片视图示例

<x-jet-form-section submit="store">
    <div class="col-span-6 sm:col-span-4">
                <x-jet-label for="name" value="{{ __('Name') }}" />
                <x-jet-input name="name" wire:model.defer="name" type="text" class="mt-1 block w-full" autocomplete="off" />
                <x-jet-input-error for="name" class="mt-2" />
            </div>
</x-jet-form-section>

在 LiveWire 组件上我有这个调试

public function store() {
  dd($this);
}

当我提交表单时，我看到输入字段值。 然后我关闭调试窗口（dd）再次按提交，现在值为 NULL。

如果我将wire:model.defer更改为wire:model.lazy，这种情况就不会再发生。有用。 为什么？！

Answer 1

使用

wire:model.lazy

而不是

wire:model.defer

这将解决您的问题

Answer 2

您必须将表单标签上的

wire:submit.prevent="store"

替换为

submit:"store"

。 因为这一行指定当提交表单时，应调用 Livewire 类中的“store”方法，并防止页面重新加载。