Setting wire:model value with wire:click or alpine js?

Question

I am trying to create a custom dropdown to change the icon of a button with alpinejs since I can't have icons or styling with the default select and options html

This is the livewire code to update icon

public function updateTagIcon($id,$value)
    {
        $this->icon = $value;

        $this->validate([
            'icon' => 'required',
        ]);

        $this->tag->update(['icon' => $this->icon]);

        $this->tag=Tag::find($this->tag->id);

    }

Is there a way I can do @click with alpineJS to set $value=1 and pass that to livewire?

Or maybe there is a way to arbitrarly set this data with wire:click?

<div wire:click="updateTagIcon({{$tag->id}},'{{$value=2}}')">
  <button type="button">
     <svg> //</svg>       
     {{$tag->title}}           
  </button>   
</div>

Was thinking maybe to emit an event with alpine @click but still not sure how I would pass a value to update the $icon in livewire

Answer 1

This is how to set values

wire:click="updateTagIcon({{$tag->id}},7)"

Than the livewire function looks like

public function updateTagIcon($id,$icon)
    {
        $this->icon = $icon;
    
        $this->validate([
            'icon' => 'required',
        ]);

        $this->tag->update(['icon' => $this->icon]);

        $this->tag=Tag::find($this->tag->id);

    }