我有一个简单的react-native应用程序,并设置了redux存储。基本上我想添加一个新故事,发送redux动作并在创建后转换到这个新故事。
我的Container Component中有以下代码,当用户点击answers
按钮时会运行该代码。
add
以下行动创作者。
addStory() {
this.props.actions.stories.createStory()
.then(() => Actions.editor({ storyId: last(this.props.stories).id }); // makes the transition)
}
如您所见,我在动作创建者中返回一个承诺。如果我未在此处返回承诺,则会在 状态更新之前进行转换。
这对我来说似乎有点奇怪 - 为什么我必须在此处返回已解决的Promise?调度不是同步的吗?
答案 0 :(得分:6)
如评论
所述回调示例:
addStory() {
this.props.actions.stories.createStory( (id) => {
Actions.editor({ storyId: id })
});
}
export const createStory = ( callback ) => (dispatch) => {
const _unique_id = uniqueId('new');
dispatch({ type: CREATE_STORY, payload: { storyId: _unique_id } });
callback(_unique_id);
};
超时示例: 在这里,我们假设州现在已经更新了......大多数时候情况并非如此。
addStory() {
this.props.actions.stories.createStory()
setTimeout( () => {
Actions.editor({ storyId: last(this.props.stories).id });
}, 500);
}
export const createStory = () => (dispatch) => {
dispatch({ type: CREATE_STORY, payload: { storyId: uniqueId('new') } });
};
<强>无极:强> 这可能需要一秒或一分钟才能完成..这并不重要。你做了你必须在这里做的一切,最后解决它,以便应用程序/组件可以执行下一步操作。
export const createStory = () => (dispatch) => {
return new Promise( (resolve, reject) => {
// make an api call here to save data in server
// then, if it was successful do this
dispatch({ type: CREATE_STORY, payload: { storyId: uniqueId('new') } });
// then do something else
// do another thing
// lets do that thing as well
// and this takes around a minute, you could and should show a loading indicator while all this is going on
// and finally
if ( successful ) {
resolve(); // we're done so call resolve.
} else {
reject(); // failed.
}
});
};