3 years ago

Today we will create a modal with Laravel Livewire and without jQuery, actually without javascript at all. We will use Laravel 8 and Bootstrap 4, but feel free to use whatever CSS Framework you want, from Tailwind CSS to Bulma…

So let’s just do it in Livewire, open our PHP Component Logic, and add this code: And let’s add our blade logic in my-example-modal.blade.php: Our logic is clear…

Let’s open our welcome.blade.php and put some buttons to play with and let’s also add include our modal: We use the special method $emit, first parameter is the event we want to emit, and the other parametes are data we want to pass to our receving component, in our case our modal.

Now let’s write our receiving logic, in our modal: We listen to showModal, we get and set our data from $emit, in this case $this->data we will contain “SomeData” and we show up our modal with doShow(); Now we can also display our data in our modal, if we wish: And we are done !