Javascript、Redux-thunk、同步/嵌套承诺



我有一个直接消息传递应用程序。所有数据都存储在Firebase中。每个聊天都包含一组用户ID。

我使用以下功能从componentDidMount():获取所有聊天

return dispatch => new Promise(resolve => FirebaseRef.child('chats')
.on('value', snapshot => resolve(dispatch({
type: 'CHATS_REPLACE',
data: snapshot.val() || [],
})))).catch(e => console.log(e));

通过:

chatReducer(state = initialState, action) {
case 'CHATS_REPLACE': {
let chats = [];
if (action.data && typeof action.data === 'object') {
chats = Object.values(action.data).map(item => ({
id: item.id,
title: item.title,
authorizedUsers: Object.values(item.authorizedUsers).map(user => ({
id: user.id,
// Somedata: fetchUserData(user.id)
// -> pretty sure it can't be done here <-
})),
}));      
}
return {
...state,
error: null,
loading: false,
chats,
};

如何在users/:uid从Firebase获取每个聊天中每个用户的更多数据?

我不知道这个用例是什么。如果你能分享,比如你想使用多少关于用户的信息,那就太好了。若它的数据很小,为什么不将其添加到同一个API中。您可以在同一对象中传递用户数据,将用户id作为密钥,并在嵌套数据中使用相同的密钥,如(仅当用户数据很小或您知道API数据总是受到限制,如由于分页或页面大小。):

{
posts : [
{
title : 'abc'
authorizedUsers : ['1a', '2b', '3c']
}, ....
],
users : {
'1a' : {
name : 'john doe',
profileImage : 'https://some.sample.link',
},
'2b' : {
name : 'bob marshal',
profileImage : 'https://some.sample.link2',
}
}
}

如果数据巨大或无法添加到API中(因为API归第三方所有),那么您唯一可以放置代码的地方是,而不是在收到响应后仅调度操作,仅在服务中循环响应,进行异步调用以仅获取所有">唯一用户",将该数据附加到您从上一次API调用收到的数据中,然后将具有完整数据的动作分派到存储器。这可能不是最好的方式,因为一切都必须暂停,即即使是在1stAPI中接收的数据也会暂停(不会在屏幕上更新),直到所有用户的数据都被提取出来。但只有当我们了解了更多关于用例的细节后,才能给出最佳解决方案。就像在最终用户滚动屏幕并可能看到特定帖子时懒惰地获取用户数据,或者在您开始从第一个API调用呈现数据时获取用户详细信息,比如制作一个组件来显示用户与帖子及其组件DidMount的关联,您将userId作为道具从顶部组件传递,该组件可能是"文章/博客/博客"组件,它在实际呈现该"文章/帖子/博客"时获取数据。

希望这能有所帮助。

最新更新