嗨,Stack Overflow社区!
我正在寻找一种良好的做法和实现,以等待组件中的分派(dispatch)操作。
我知道React-Native和Redux-Saga只是说:别等它,让商店更新,并通过选择器重新渲染您的 View 。
一切都很好,但是如何处理这样的事情:
onPress = (object) => {
this.props.editObject(object).then(() => { //editObject is an action
NavigationService.navigateTo(otherScreen);
}).catch((error) => {
// Handle and show validation errors
})
}
当然,在上面的示例中,由于没有那么多或没有抓住,这是一个行动而不是一个 promise ,因此崩溃了……那么,如何实现这样的流程呢?
我唯一能想到的解决方案是将一个字符串NavigationTo传递给该动作并在saga本身中导航,这根本不是干净的...
有什么建议吗?
编辑:
对于这个问题,我仍然没有找到好的解决方案,并且对redux-saga中间件越来越感到沮丧。
让我们举一个更具体的例子:
我有一个配置文件和图像,需要(依次)更新,在任何普通的js框架中,这都是
try {
setLoading(true);
await updateProfile(...);
await updateProfileImage(...);
navigate(...)
} catch (e) {
//...
} finally {
setLoading(false);
}
要使用redux-saga来实现此目的,需要带我一个新商店(带有profileUpdateDone,profileUpdateFailedStatus,profileImageUpdateDone和profileImageUpdateFailedStatus),一个新的reducer,新的选择器,...
商店因为添加了所有这些废话而变得肮脏不堪。我可以为每个组件引入一个商店,reducer,操作和选择器,但是我有58个组件和7个商店来管理应用程序的全局状态。拥有65个存储,65个减速器,65个选择器文件等似乎难以管理...
我一直在努力寻找一种简洁的设计模式来解决此问题。似乎最基本的基本任务是任何JS框架都应该能够轻松处理,但是由于某些原因,在redux-saga中是不容易的。
我是唯一面临此问题的人吗,还是redux-saga仅适用于具有以下功能的小型应用程序:不超过20个屏幕?
最佳答案
您可以将一个初始状态存储在减速器中,即isEditObjectDone:false
。
当reducer从动作接收数据时,将其更改为true
。
并且,在屏幕上的componentDidUpdate
或componentWillReceiveProps
做这个,
if(this.props.isEditObjectDone){
NavigationService.navigateTo(otherScreen);
}
不要忘记将状态映射到道具。
编辑:
采取行动返回
promise
,像这样,
editObject = object => dispatch =>
new Promise((resolve, reject) => {
//your code and dispatch thing
// don't return dispatch instead do this
dispatch({
type: 'something',
...
});
if (something)
resolve(someData);
else
reject(someError);
});
关于react-native - React-Native/Redux-Saga:如何等待调度完成,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/54783347/