Estoy tratando de enviar un formulario de contacto usando laravel livewire como:
public $name; public $email; public $phone; public $message; public function submitForm() { $attributes['name'] = $this->name; $attributes['email'] = $this->email; $attributes['phone'] = $this->phone; $attributes['message'] = $this->message; \App\Models\ContactForm::create($attributes); $this->resetForm(); session()->flash('success', 'Your message has been sent successfully!'); $this->emit('formSubmitted'); }Ahora quiero mostrar el mensaje de éxito usando JS en mi front-end, así que lo hago así:
<script type="text/javascript"> $( document ).on("DOMContentLoaded", () => { Livewire.on('formSubmitted', message => { console.log('{{ session('success') }}'); }); }); </script>El problema es que en la consola obtengo una "cadena vacía" en lugar del mensaje de la sesión, pero cuando escribo algunos datos estáticos en console.log() se imprime en la consola, lo que significa que el evento se activa desde el componente y el la respuesta se activa pero los datos de la sesión no se transmiten en el script
También cuando imprimo el mensaje de sesión en Blade como:
{{ session('success') }}se imprime correctamente. ¿Alguien me puede ayudar?
no es necesario guardar el mensaje en el flash de la sesión, puede hacer lo siguiente, enviar un evento del navegador desde el componente livewire con el mensaje y escucharlo en el front-end
$this->dispatchBrowserEvent('formSubmitted',['success' => 'Your message has been sent successfully!']);y luego escucharlo en javascript
$( document ).on("DOMContentLoaded", () => { // message is argument which is passed to closure, normally we pass as // event Livewire.on('formSubmitted', message => { console.log(message.detail.success); }); });para obtener una vista detallada, visite los eventos oficiales de Livewire Dispatching Browser Events