Usando el hook useState en React Native

Los hooks son algo bastante util en React Native, nos permiten usar funciones que antes solo estaban disponibles para componentes de tipo clase en componentes funcionales. Uno de los hooks mas básicos y útiles es el hook “useState” que nos permite hacer uso del state en un componente funcional.

Para usar el hook, lo primero que tenemos que hacer es importarlo de react:

import React, { useState } from "react";

Después ya lo podemos usar para inicializar nuestra state, por ejemplo, de una lista de posts que vienen de una llamada a una API:

const [posts, setPosts] = useState([]);

Primero se pone el nombre de el state, en este caso “Posts” y después la función que modificará el state, en este caso “setPosts”

Para modificar el state, en este caso podemos hacer algo como:

 .get("API URL")
.then(response => {
const posts = response.data;
setPosts(posts);
})

Para poner el resultado del get en el state de posts. Para usarlo después en nuestro componente, simplemente la mandamos llamar, en este caso podría ser en un componente FlatList:

 <FlatList
keyExtractor={cosa => cosa._id}
data={posts}
...

 

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión /  Cambiar )

Google photo

Estás comentando usando tu cuenta de Google. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

Conectando a %s