Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

darkylmnx's avatar

Livewire: access loading state in JS and/or Alpine JS

I have a situation where I need to have access to the loading state in JS or through Alpine in Livewire.

I have a webcomponent (but could be a vue component or anything) where I need to change a prop when the current livewire component is loading.

I tried this:

<form class="mt-3" wire:submit="addContact">
	<div wire:ignore id="app"><my-loader wire:loading.attr="is-loading"></my-loader></div>
</form>

But this only toggles an "attribute" but what I need to change is the "property" of the component, not the HTML attribute.

Also, it only gives ability to toggle, not to choose a specific value.

I've even tried the following but it doesn't work (x-data has isLoading set, I just didn't show the boilerplate code):

<form class="mt-3" x-on:submit.prevent="
            isLoading = true;
            $wire.addContact().finally(() => (isLoading = false))
">
            <div wire:ignore id="app"><my-loader x-bind:is-loading="isLoading"></my-loader></div>
</form>

Is there a way to access the current loading state of the livewire component?

0 likes
0 replies

Please or to participate in this conversation.