Reputation: 16297
I have a component that is entangling a livewire property.
<div x-data="{show: @entangle($attributes->wire('model'))}>
<form>
<input type="checkbox" wire:model.defer="story.show_name" name="show_name" />
</form>
</div>
I have a form within this component. If I update any field within the form it will send an update to the server bug it also modifies the wire:model. An example would be a checkbox. If I uncheck it then the component hides.
Example:
[
{
"type": "syncInput",
"payload": {
"name": "story.show_name",
"value": false
}
},
{
"type": "syncInput",
"payload": {
"name": "show",
"value": false
}
}
]
Any idea why this would suddenly be capturing all input/change events?
Upvotes: 0
Views: 1675
Reputation: 16297
The problem was due to me adding all attributes to the component like so {{$attributes}}
. This would add wire:model="show"
to the element. Since my component wasn't an input field and just a div it would then accept all input
events.
I replaced {{$attributes}}
with {{$attributes->except('wire:model')}}
to fix the problem.
Upvotes: 1