Estoy por primera vez tratando de consumir una API con axios en reaccionar nativo.
Mi objetivo es demostrar el nombre del estado en la pantalla, a partir de esta api ( https://servicodados.ibge.gov.br/api/v1/localidades/estados/ ), sin embargo, cuando lo mapeo con solo { date.name}, pero el contenido no se muestra.
¿Qué estaría haciendo mal?
import React, { useEffect, useState } from "react"; import { Icon } from "react-native-elements"; import { View, TextInput, ScrollView, FlatList, Text } from "react-native"; import { Container, SearchInput, SearchInputText } from "./styles"; import Header from "../../components/Header"; import DashedCircle from "../../components/DashedCircle"; import axios from "axios"; export default (props) => { const [data, setData] = useState([]); useEffect(() => { async function fetchData() { const response = await axios.get( "https://servicodados.ibge.gov.br/api/v1/localidades/estados/" ); setData(response.data); } fetchData(); }, []); console.log(data); return ( <> <DashedCircle /> <Container> <Header onPress={() => props.navigation.goBack()} /> <SearchInput> <SearchInputText placeholder="Buscar estado" /> <Icon name="search-outline" type="ionicon" color="#c4c4c4" style={{ paddingHorizontal: 15, paddingVertical: 15, }} /> </SearchInput> {data.map((item) => { <Text>{data.nome}</Text>; })} </Container> </> ); };Está mapeando data así que llame al nombre del item , intente:
{data.map((item) => { <Text>{item.nome}</Text> })}