Redux - Résoudre une Promesse après avoir appelé l'action dispatch dans le composant

Question

J'ai une action 'addToFolder' qui distribue une action qui est gérée dans mon réducteur Redux.

export function addToFolder(folderIds, contentId, contentType) { 
    const item = {}; 
    item.folder_ids = folderIds; 
    item.content_id = contentId; 
    item.content_type = contentType; 

    return function(dispatch) { 
    return fetch(`${getAPIPath}api/addtofolder`, { 
     method: 'PUT', 
     body: JSON.stringify(item), 
     credentials: 'include', 
     headers: { 
     Accept: 'application/json', 
     }, 
    }) 
    .then((response) => { 
     response.json().then((res) => { 
     dispatch(addToFolderSuccess(res.data)); 
     }); 
    }).catch((error) => { 
     throw (error); 
    }); 
    }; 
} 

Dans mon composant après avoir cliqué sur le bouton "Ajouter aux dossiers", l'action est répartie. Je voudrais utiliser .then pour déclencher une action de collation/notification, mais utiliser la réponse de mon appel API pour remplir l'ID et le texte du message affiché par la notification. Actuellement response est indéfini.

addToFolder =() => { 
    this.props.actions.addToFolder(this.state.activeItems, this.props.contentId, this.props.contentType) 
     .then((response) => { 
     this.setState({ addBtnLoading: false }); 
     this.props.actions.dispatch(showSnack(response.id, { 
      label: response.message, 
      timeout: 4000, 
     })); 
     }); 
    }; 

Answer 1

Vous avez oublié de retourner

.then((response) => { 
     // nested promise 
     return response.json().then((res) => { 
     dispatch(addToFolderSuccess(res.data)); 

     // the result 
     return res; 
     });