Laravel Livewire Swiper Example

Minimalistic example showing how to get Swiper working with Laravel Livewire. The trick is to re-inizialize SwiperJS after Livewire updates the DOM, as suggested here.

This is achived dispatching a browser event in the component: $this->dispatchBrowserEvent('onContentChanged'); The page catches the event and re-initializes Swiper:

window.addEventListener('onContentChanged', () => {
    initializeSwiper();
});

Running the example

composer install
npm install
npm run dev

Set the .env file according to your environment. In particular, if your /public directory is not mapped under root, set LIVEWIRE_ASSET_URL=/<path> with the relative path of your public directory.

License

This code is open-sourced software licensed under the MIT license.