2017-08-30 4 views
0

Mit React und Redux muss ich warten, bis alle meine Aktionen erfüllt sind, um den Komponentenstatus zu aktualisieren. Lesen von Axios-Dokumenten Ich habe axios.all gefunden, um alle meine Aktionen zu sammeln und darauf zu warten, dass alle aufgelöst werden (im Grunde rufe ich eine API n mal auf, um Informationen über n Elemente zu erhalten). Das Problem ist, dass die console.log innerhalb der. Then-Funktion von axios.all überhaupt nichts zurückgibt, aber Aktionen ordnungsgemäß ausgelöst werden.Axios.all in componentWillReceiveProps nicht aufgerufen

if (this.props.evaluation && this.props.evaluation.topics) { 
    var promises = [] 

    var array = this.props.evaluation.topics; 
    var selectedArray = [] 
    for (var i = 0; i < array.length; i++) { 
    promises.push(this.props.fetchTopic(array[i])) 
    } 

    axios.all(promises).then(function(results) { 
    results.forEach(function(response) { 
     console.log('///////////////////////'); 
     console.log(response.value); 
     console.log('///////////////////////'); 
    }) 
    }); 
} 

EDIT: Hier ist mein fetchTopic Code

In meiner Komponente:

const mapDispatchToProps = (dispatch) => ({ 
    fetchTopic: (id) => dispatch(fetchTopic(id)), 
}) 

In meinem actions.js diese

export const fetchTopic = (id) => ({ 
    type: "FETCH_TOPIC", 
    payload: axios.get(process.env.SERVICE_URL + '/topic/' + id, { headers: { 'Authorization': 'JWT ' + sessionStorage.jwt }}) 
}) 
+0

hinzufügen 'fetchTopic' Code. Stellen Sie sicher, dass es ein Versprechen zurückgibt. –

+0

Actions-Ersteller müssen einfache JavaScript-Objekte zurückgeben, Ihre ist ein Axios-Aufruf in der Payload, der nicht funktioniert –

Antwort

0

ändern

export const fetchTopic = (id) => ({ 
    type: "FETCH_TOPIC", 
    payload: axios.get(process.env.SERVICE_URL + '/topic/' + id, { headers: { 'Authorization': 'JWT ' + sessionStorage.jwt }}) 
}) 

dieser

export const fetchTopic = (id, cb) => { 
    axios.get(process.env.SERVICE_URL + '/topic/' + id, { headers: { 'Authorization': 'JWT ' + sessionStorage.jwt }}) 
    .then((response) => { 
     if (cb) cb({ type: "FETCH_TOPIC", payload:response }) 
    }); 
    } 

Und laufen

for (var i = 0; i < array.length; i++) { 
    this.props.fetchTopic(array[i], (result) => { 
    // get the result here 
    }) 
} 
Verwandte Themen