Multiple @entangle on one component

#1

Hello,

I wonder, how can I have two wire:model on one component? E.g.:

<x-comp wire:model="tags" search="" :results="$filteredValues"/>

I need tags and search to sync with the component. The search input in x-mycomp is passed to the parent and the parent will update $filteredValues. When the user selects a tag in x-mycomp, the changes are synced with the tags property in the parent component aswell.

Relevant parts of x-mycomp:

x-data="
    Components.tagSearchSelect({ 
        tags: @entangle($attributes->wire('model')),
        results: {{json_encode($results)}}
    })
"

and

<input 
     x-model="search"
     wire:model="search"
     x-ref="search"
     ...
/>

When I select a tag and input something into the search field, I instantly get

Livewire encountered corrupt data when trying to hydrate the [categories-form] component. Ensure that the [name, id, data] of the Livewire component wasn’t tampered with between requests.

When I remove wire:model="search" the error disappears, but of course, the search functionallity does not work anymore.

Any idea what the problem is?

Warm regards,
Art