Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.
¿Es posible manipular las propiedades de estilo de un objeto HTML con AlpineJS accediendo a él a través de la variable mágica <code>$refs</code>? Parece que puedo acceder a las propiedades del elemento, ¿pero no puedo actualizarlas? Después de presionar el <code>button</code>, no sucede nada (desde el punto de vista del . . . Read more
Tengo este código que funciona y la animación es agradable: <script src="https://unpkg.com/alpinejs@3.7.0/dist/cdn.min.js"></script> <div x-data="{ open: false }" x-on:click.outside="open = false" x-on:keydown.escape="open = false"> <button x-on:click="open = !open"> Haz clic </button> <div x-show="open" x-transition> <div> <ul> <li>Perros</li> <li>Gatos</li> <li>Serpientes</li> </ul> </div> </div> </div> Luego intento usar la etiqueta <template> en lugar . . . Read more
He creado un componente de carga de archivos múltiples utilizando Laravel Livewire. Después de completar la carga, quiero mostrar los archivos cargados sin tener que recargar la página, de la siguiente manera: <div class=”grid grid-flow-col auto-cols-max gap-4 mb-5″> @foreach ($files as $file) <livewire:file :file=”$file”></livewire:file> @endforeach </div> Cargar uno o varios . . . Read more
Construyendo una tabla de datos con el último Alpine.js (v3.7.0). Encontré un problema al intentar implementar filas hijas (es decir, una fila adicional desplegable debajo de la fila principal/padre). Versión simplificada: <tbody> <template x-for=”row in currentPageData” :key=”row.id”> <tr> <td>foo</td> <td>bar</td> <td>baz</td> </tr> <tr> <td colspan=”3″> Algun contenido adicional </td> </tr> . . . Read more
Estoy tratando de mover algunas funciones de alpine.js dentro de un archivo externo de JavaScript, con la idea de poder manipular el estado de, por ejemplo, un modal después de enviar un formulario con ajax. Entonces, mi modal con tailwind: <div x-data=”showFileModal” class=”inline-block”> <button type=”button” @click=”toggle”>{{ __(‘Open Model’) }}</button> </div> . . . Read more