Redux thunk - 嵌套分派的函数/动作

我正在使用 redux-thunk 在我的 React 应用程序中执行异步操作,如下所示:


export const fetchImages = (objects) => dispatch => {

   const promises = objects.map(obj => axios

       .get(`${API_URL}/files/${obj.img ? vendor.img : 'default.png'}`, {responseType: 'arraybuffer'})

       .then( res => obj.imgData = 'data:;base64,' + convertArrayBufferToBase64(res.data))

   );

   return Promise.all(promises).then (() => Promise.resolve(objects));

}

当我在我的任何组件中使用它时,这完全正常。但是,如果我在另一个动作中使用它,如下所示:


export const fetchAllObjects = () => dispatch => axios.get(`${API_URL}/objects?limit=50`)

   .then(res => fetchImages(res.data.docs).then(objects => 

       dispatch({

           type: FETCH_ALL_OBJECTS,

           payload: objects

       });

   ));

它失败。我希望它返回一个承诺,但是它返回“dispatch => ...”,因此then()返回值失败。


RISEBY
浏览 116回答 1
1回答

斯蒂芬大帝

我刚刚注意到这fetchImages是一个返回函数的函数:export const fetchAllObjects = () => dispatch => axios.get(`${API_URL}/objects?limit=50`)   .then(res => fetchImages(res.data.docs)(dispatch).then(objects =>        dispatch({           type: FETCH_ALL_OBJECTS,           payload: objects       });   ));
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript