Axios Callback auf GET für React

Question

Ich versuche, eine Lade Spinner anzeigen, während die Axios Anfrage erhalten wird, und damit ich glaube, ich brauche einen Rückruf von der Anfrage. Ich nenne die Erhaltungs-Anforderung in componentDidMount() wie so:

componentDidMount() { 
    this.props.fetchCloudProperties(() => { 
    this.setState({ dim : false }); 
    }); 
} 

Wo hoffentlich, wenn die Daten abgerufen werden, die Dimmer (Spinner) gehen weg aus der Basis dieser seState Anruf. Ich habe Callbacks mit Posts, aber habe noch nie einen mit get gemacht. Meine get Aktion für die Daten ist:

export function fetchCloudProperties(callback) { 
    const VARIABLE_URL = '/cloud/properties'; 
    const request  = axios.get(`${ROOT_URL}${VARIABLE_URL}`) 
    .then(request => { 
     return ({ 
     type : FETCH_CPS, 
     payload : request 
     }); 
    }).catch((error) => { 
     console.log(error); 
    }) 
} 

Im Moment ist die Konsole beschwert sich über ‚Aktionen Ebene Objekte sein müssen‘, die ich bin nicht sicher, was das bedeutet, aber auch ich habe es über ‚unhandled Ablehnung‘ beschweren gesehen also nicht so sicher.

EDIT: Ich habe eine createCloudProperty Methode, die einen Rückruf verwendet und es funktioniert gut:

export function createCloudProperty(values, callback) { 
    const VARIABLE_URL = '/cloud/property'; 
    const request  = axios.post(`${ROOT_URL}${VARIABLE_URL}`, values) 
    .then(() => callback()); 

    return ({ 
    type : CREATE_CP, 
    payload : request 
    }); 
} 

, die aus aufgerufen:

onSubmit(values) { 
    this.props.createCloudProperty(values,() => { 
    this.props.history.push('/cloudproperties'); 
    }); 
} 

Answer 1

Sie passieren können nicht die Anforderung/Antwort weil es kein einfaches Objekt ist. Sie sollten die Antwortdaten verwenden.

export function fetchCloudProperties(callback) { 
    const VARIABLE_URL = '/cloud/properties'; 
    const request  = axios.get(`${ROOT_URL}${VARIABLE_URL}`) 
    .then(response => { 
     return ({ 
     type : FETCH_CPS, 
     payload : response.data 
     }); 
    }).catch((error) => { 
     console.log(error); 
    }) 
}