@composi/runtime:
Composición
Un Programa dentro de Otro
A medida que un programa se vuelve más complejo, lo mismo pasa con su vista. Esto puede requerir dividirlo en partes más pequeñas, incluso almacenarlas en archivos separados para que puedan reutilizarse. La naturaleza de los componentes funcionales hace que sea fácil componerlos juntos, pasando las props de padres a hijos. Puede obtener más información sobre la composición de componentes funcionales en la sección sobre la función render.
También es posible que desese utilizar un pequeño programa de entrono de ejecución dentro de otro. Esto es posible, aunque un poco complejo. Hay que tener en cuenta al hacer esto que la función render de @composi/core solo puede procesar el marcado. Eso significa que la vista del programa hijo no puede renderizar su componente, sino tiene que devolver lo como marcado. De esa manera, la vista del componente padre manejará la renderización de la vista del hijo. Fíjate cómo lo hacemos en el siguiente ejemplo:
See the Pen @composi/core + runtime Composición1a by Robert Biggs (@rbiggs) on CodePen.
Communicación de Padre a Hijo
Podemos usar técnicas similares para que el padre cambie el estado predeterminado de un programa hijo. El siguiente ejemplo muestra cómo lo hacemos con un efecto sencillo que se transmite al hijo. Nota que el programa contador tiene su estado establecido en 22. Pero el padre sobrescribe ese valor a 123.
See the Pen @composi/core + runtime Composición3a es by Robert Biggs (@rbiggs) on CodePen.
Communicación de Hijo a Padre
Por usar el mismo formato del ejemplo previos, tenemos un ejemplo de hijo usando un efecto para comunicar con su padre.
See the Pen @composi/core + runtime Composición4a es by Robert Biggs (@rbiggs) on CodePen.