Spinner Example about wireui HOT 4 CLOSED

Hello @kevyworks

You can show spinner loading when any or specific livewire action is fired, see the examples

Consider these examples inside a livewire component

It will show a loading spinner when any request is fired
<x-button label="Save" spinner />
It will show a loading spinner only when the delete method is fired
<x-button label="Delete" spinner="delete" />

Note: if the spinner is passed without value, any requests will show a loading spinner
Note: This spinner works using a livewire loading state, so, you must have the livewire styles @livewireStyles or <livewire:styles /> in your layout

from wireui.

@PH7-Jack Thanks, I added @livewireStyles and recompiled and it works.. Please do note this on Installation instruction as well. Appreciate your help! thanks!

from wireui.

@PH7-Jack By the way, I have a custom component without a Component Class, Is there a way to trigger spinner if this component was loaded via BladeCompiler::component('x-form', 'components.form') ?

<x-form action="{{ route('verify-email') }}">
    <x-button outline primary spinner type="submit" label="{{ __('Resend Verification Email') }}" />
</x-form>

Above seems not working with spinner. Any hacks for this?

from wireui.

This spinner works only inside a livewire component, if you have a form blade component, and the button is inside this form, will work. Otherwise, you need create a custom component to works using ajax

from wireui.