实现类似Flux的解决方案的代码看起来相当简单,但我不清楚何时适当以及如何以最佳实践意义安排事情.
在超级外行的情况下,我对一个常见用例的最佳猜测是,Flux允许组件相互通信而不会传递常见的道具,所以考虑到这一点,这里有一个我希望在我的使用Flux的例子应用：
假设我有一个用户配置文件组件,它通过ajax调用定期刷新.当此调用正在等待返回其数据时,加载微调器gif将显示在页面的其他位置 – 而不是在触发ajax调用的组件的父级或子级中.在这种情况下,我如何使用Flux在适当的时刻提示微调器显示/隐藏(即从发送请求开始,在收到响应时结束)？如果它的可见性是由配置文件组件的状态定义的,那很容易,但显然我需要一个组件来与我认为你可以称之为远房堂兄的东西进行通信.
我将如何布置我的行动,减速器等等？
我不是在寻找任何人在这里为我编写代码,因为我肯定会通过这样做来更好地学习,但我肯定会欣赏一些关于在这种情况下使用的方法的一般建议.
非常感谢！
Redux基本上为您提供任何组件可以挂钩的全局状态.所以对于你的ajax电话,你有3个动作.查看the Redux docs for creating async actions.
GET_USER_PROFILE_START GET_USER_PROFILE_SUCCESS GET_USER_PROFILE_ERROR
然后你会有减速器
userProfile isUserProfileLoading
当您触发ajax请求时,异步操作将首先触发您的GET_USER_PROFILE_START操作,该操作将由您的isUserProfileLoading reducer选取,并将isUserProfileLoading设置为true.
然后当请求返回时,如果成功,它将使用userProfile的有效负载触发GET_USER_PROFILE_SUCCESS.您的userProfile reducer将接收userProfile并将其设置为state.
您的isUserProfileLoading reducer也将监听GET_USER_PROFILE_SUCCESS,并在看到该操作时将isUserProfileLoading设置为false.
如果您的请求失败,则使用错误有效负载触发GET_USER_PROFILE_ERROR操作,并在UI中执行某种通知.并且你的isUserProfileLoading reducer也将监听GET_USER_PROFILE_ERROR,并且当它看到它时也会将isUserProfileLoading设置为false.
现在,无论页面上或组件层次结构中的任何组件,您的应用程序中的任何组件都可以查看isUserProfileLoading并在其设置为true时呈现加载微调器.
希望有所帮助.