Modales de Bootstrap con Livewire
En el componente de Livewire, agregar una variable pública, en este caso llamada $editando
<?php
namespace App\Http\Livewire\ComponenteEjemplo;
use Livewire\Component;
class Crear extends Component
{
public $editando= false;
// ...
}
En la blade
, agregar
<div class="modal {{$editando ? 'd-block' : ''}}" data-backdrop="static" data-keyboard="false" tabindex="-1">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Título</h5>
<button type="button" class="close" wire:click="$set('editando', false)">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
{{-- Contenido aquí --}}
</div>
</div>
</div>
</div>
@if($editando)
{{-- Esto agrega el fondo obscuro propio del modal --}}
<div class="modal-backdrop show"></div>
@endif