Estoy tratando de llamar a una función llamada makeMap en la función de renderizado. Todo se imprime en la consola, sin embargo, no actualiza el HTML. Me encantaría saber qué estoy haciendo mal y cuál es la forma correcta de hacerlo. :)
import React from "react"; import axios from "axios"; export default class CountryList extends React.Component { state = { countries: [] } componentDidMount() { axios.get(`https://restcountries.com/v2/all?fields=name,region,area`) .then(res => { const countries = res.data; this.setState({ countries }); }) } makeMap() { this.state.countries.map(country => { console.log("aaaaaaaaa"); return (<li key={country.name}>{country.name}</li>) }) } render() { return( <div> {this.makeMap()} </div> ) } }Puede cambiar la función makeMap() de la siguiente manera:
makeMap() { return this.state.countries.map(country => (<li key={country.name}>{country.name}</li>) ) }