PropTypes en React v15.5.0
PropTypes en React v15.5.0
¡INSCRÍBETE A CUALQUIER CURSO CON UN 50% DE DESCUENTO PARA NUEVOS CLIENTES!

Vamos a ver cómo crear una lista de tareas con React, o cómo se suele decir, un TODO (cosas a hacer), simplemente vamos a seguir el ejemplo de TODO al pie de la letra.

Cómo ya hemos ido viendo, React nos proporciona una serie de herramientas para poder trabajar el dom de forma muy flexible, dinámica y sobre todo sencilla.

Aquí crearemos formulario con un campo de texto y un botón, todo ello en el contexto de una clase haciendo uso del método React.createClass, entonces tendremos dos clases, una encargada de crear las nuevas tareas (el formulario) y otra clase encargada de mostrar las tareas en una lista desordenada.

Mostrar los items será sencillo gracias a la función map de javascript, de esta forma, también veremos cómo podemos utilizar una clase desde otra, realmente no hay que hacer nada, simplemente llamarla.

Crear una lista de tareas con React

Lo único que debemos hacer es crear dos archivos, un index.html y un form.jsx, abre el primero y añade el siguiente código.


Ahora añade el siguiente código al archivo form.jsx.


Si ahora abres el navegador verás un formulario, si añades cualquier elemento y lo guardas dicho elemento aparecerá automáticamente, y todo ello así de sencillo.

Cómo puedes ver, React nos permite utilizar las clases dentro de otras clases, así podemos poner la lista de tareas encima del formulario para que se muestren los items.