mlimasolucoes mlimasolucoes - 7 months ago 47
Javascript Question

Axios array map callback

On my react ES6 app i need to do the follow:
Get a list of git hub members of some organization and after it get the info details of each one.

The code:



handleDevelopers(res){
let lista = res.data.map(function(result) {
axios.get('https://api.github.com/users/'+result.login)
.then(function (response) {
console.log(response.data.name);
return <GitUser key={response.data.id} name={response.data.name}/>;
});


});

this.setState({
users: lista
});
}

componentWillMount() {
axios.get('https://api.github.com/orgs/:orgname/members')
.then((jsonRes) => this.handleDevelopers(jsonRes))
}





How can i setState after map done?

Answer
handleDevelopers(res){
    let _self = this
    axios.all(res.data.map(function(result) {
        return axios.get('https://api.github.com/users/'+result.login)
        .then(function (response) {
            console.log(response.data.name);
            return <GitUser key={response.data.id} name={response.data.name}/>;
        });      
    })).then(function(lista){
         _self.setState({
          users: lista
        });     
}

componentWillMount() {
    axios.get('https://api.github.com/orgs/:orgname/members')
    .then((jsonRes) => this.handleDevelopers(jsonRes))
}