Tengo una pregunta sobre laravel livewire , cuando cambio alguna propiedad de mi componente, ¿la entrada frontal vinculada a esa propiedad emite algún evento?
public function edit(Post $post) { $this->post = $post; $this->start_date = $post->start_date; }Estaba pensando en el envío de livewire del mismo evento que se usa para escuchar el frente:
<input wire:model="start_date" type="date" id="dateId" /> <script wire:ignore> document.addEventListener('livewire:load', function () { $("#dateId").on('input', (event) => { console.log(345); }); }); </script>Pero nada.
No inmediatamente cuando cambia una propiedad dentro del componente PHP Livewire de la manera que mostró.
Debería emitir un evento de navegador desde Livewire Component y escucharlo en la interfaz como se describe en docs .
También puede probar Global Livewire JavaScript Object : Livewire.on(eventName, (...params) => {})
Pero la forma más fácil de interactuar con Livewire es probablemente con Alpine.js .
De acuerdo con la documentación de livewire 2.x , lo que está buscando podría ser uno de estos ganchos. Tal vez componente.inicializado, elemento.actualizado, elemento.actualizado o uno de los mensajes.
| Manos | Descripción |
|---|---|
component.initialized | Llamado cuando un componente ha sido inicializado en la página por Livewire |
element.initialized | Llamado cuando Livewire inicializa un elemento individual |
element.updating | Llamado antes de que Livewire actualice un elemento durante su ciclo de diferenciación de DOM después de un viaje de ida y vuelta a la red |
element.updated | Llamado después de que Livewire actualiza un elemento durante su ciclo de diferenciación de DOM después de un viaje de ida y vuelta a la red |
element.removed | Llamado después de que Livewire elimina un elemento durante su ciclo de diferenciación de DOM |
message.sent | Llamado cuando una actualización de Livewire activa un mensaje enviado al servidor a través de AJAX |
message.failed | Llamado si el envío del mensaje falla por alguna razón |
message.received | Llamado cuando un mensaje ha terminado su viaje de ida y vuelta, pero antes de que Livewire actualice el DOM |
message.processed | Llamado después de que Livewire procesa todos los efectos secundarios (incluida la diferenciación de DOM) de un mensaje |
<script> document.addEventListener("DOMContentLoaded", () => { Livewire.hook('component.initialized', (component) => {}) Livewire.hook('element.initialized', (el, component) => {}) Livewire.hook('element.updating', (fromEl, toEl, component) => {}) Livewire.hook('element.updated', (el, component) => {}) Livewire.hook('element.removed', (el, component) => {}) Livewire.hook('message.sent', (message, component) => {}) Livewire.hook('message.failed', (message, component) => {}) Livewire.hook('message.received', (message, component) => {}) Livewire.hook('message.processed', (message, component) => {}) }); </script>