Actions on post-initial rendered elements

My component has an array property that gets updated based on changes to a text-input.

<input wire:model="search" type="text" 
            class="shadow" placeholder="Search" />

@foreach ($searchResults as $type => $result)
    <a wire:click="signupUser({{ $result->searchable }})">
       {{ $result->searchable->name }}
   </a>
@endforeach

However, the wire:click action does not fire. It fires if I assign the action to an element that exists on initial render, so I’m thinking my problem is that the wire:click is assigned after the wire:model=“search” updates. How do you all handle this? Are we just not supposed to assign Livewire actions to dynamically rendered elements?

My version is : “livewire/livewire”: “^0.7.2”,

Nah, you can dynamically make however many you want. This sounds like dom diffing. Usually means your component view isn’t wrapped in a div. If that isn’t the case, check out the troubleshooting section in the docs for other possible fixes.

Hi @chimalsky,
sorry for the late answer.

@xxdalexx answer is right!
Try to add wire:key="" to your <a> tag, as Caleb as mention in the section Troubleshooting on Livewire doc!

1 Like