Crear un Componente Wizard Utilizando Componentes Compuestos y useContext React Hooks

Share this video with your friends

Send Tweet

Nuestro componente Wizard carece de flexibilidad de cara al usuario, no permite modificar la forma en que sus componentes se renderizan. Pero podemos refactorizar su código para otorgar esta flexibilidad mediante el uso del patron de diseño conocido como componentes compuestos y un estado compartido entre ellos. Para compartir implícitamente este estado utilizamos la API Context de React junto al hook useHook que ofrece una forma sencilla y directa para consumir este estado compartido. Con esto el componente entrega flexibilidad al usuario permitiéndole decidir cómo renderizar cada elemento del wizard.