Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

234
Vistas
Sincronización de estado entre componentes (Vanilla JS o Svelte)

Estoy tratando de crear un ejemplo básico de una aplicación en la que hay 2 componentes: A y B. El objetivo es hacer que cada componente envíe un evento cuando se cumplan ambas condiciones:

  • el componente está montado
  • la biblioteca de la que todos dependen está cargada

1er intento: una nueva clase LibraryLoader

https://svelte.dev/repl/ef7876d4fa8847d1ad1e13eb616b95fa?version=3.46.2

Así que pensé que necesitaría una clase simple que pudiera enviar un evento simple (no vinculado a un nodo DOM). Así que decidí crear una clase LibraryLoader que herede de una clase Dispatcher (para poder enviar un evento no vinculado a un nodo DOM). A continuación se muestra mi intento

El problema aquí es que tenemos 2 instancias de la clase LibraryLoader (creada por A & B), por lo que no funciona. ¿Quizás una clase estática que heredaría de la clase Dispatcher? (No encontré cómo hacerlo).

2do intento: LibraryLoader como un objeto literal

https://svelte.dev/repl/5c9873bb0c59493dbe6dd6ed38bde276?version=3.46.2

Leer algunas publicaciones sobre el patrón singleton me llevó a la idea de transformar la clase LibraryLoader en un objeto literal simple. Y está funcionando mejor aquí.

Los componentes A y B están haciendo lo mismo:

  1. una vez que el componente está montado, ejecuta checkstate() que solicitará que se cargue la biblioteca o simplemente esperará si otro componente ya lo solicitó.

  2. una vez que se monta la biblioteca, envía un evento "listo"

Aquí funciona bastante bien. No se solicita que la biblioteca se cargue dos veces y ambos componentes A y B envían un evento "listo" como se esperaba. Pero hay un inconveniente obvio: el código está duplicado en A y B.

3er intento: Acción esbelta

https://svelte.dev/repl/3a68a7efaa8f43be8bffda12dadb83a3?version=3.46.2

Este intento hace uso de una acción esbelta que parecía ser una solución potencial hasta donde entendí cómo funciona.

Por lo tanto, puse el código en loadAndGetReady.js pero al final, el componente B nunca está LISTO, por lo que hay una trampa aquí.

tomare cualquier consejo :D

Gracias de antemano

about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda