Livewire 3 with adminLTE I can't hear the events launched from the component in my view with Alpine

Question

In my Livewire 3 component I fire an event indicating that the user was successfully updated. I can't hear it from the view with Alpine. Additionally I am using adminLTE.

My component:

    public function updatePerfil()
    {
      //  dd($this->userId);
        $this->validate([ 
            'name' => 'required|string|min:5|max:255',
            'apellido' => 'required|string|max:255',
            'email' => 'required|string|email|max:255|unique:users,email,' . Auth::user()->id,
            'fono' => 'required|string|min:11|max:11',
        ]);
        
       // $user = User::find($userId);
        
        Auth::user()->update([
            'name' => $this->name,
            'apellido' => $this->apellido,
            'email' => $this->email,
            'fono' => $this->fono,
        ]);

        $this->dispatch('perfil-updated'); 
       // session()->flash('msgPerfil','Perfil actualizado correctamente.');
        
        
       // $this->reset(['name', 'apellido', 'email', 'fono']);
      
    }

Mi vista:

            <div class="card-header">
                <div class="container">
                    <div class="row justify-content-between">
                        <div class="col-auto">
                            <h4 class="m-0 text-dark">Actualice su perfil</h4>
                        </div>
                        @if(session('msgPerfil'))
                            <div class="alert alert-info alert-dismissible fade show" role="alert" id="msgAlert">
                                {{ session('msgPerfil') }}
                                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                            </div>
                        
                        @endif
                        
                        <div x-on:perfil-updated="alert('Recibido')"></div>
                        
                    </div>
                </div>
            </div>

I have tried literally everything the livewire 3 and Alpine documentation says but I can't hear it.

Answer 1

Try to listen to the event at "window level":

<div @perfil-updated.window="alert('Recibido')"></div>