假设有 2 个日期选择器对象对应于开始日期和结束日期。
这些作为状态存在,因此为了设置它们,您必须调用setStartDate或setEndDate,然后reducer拾取并简单地设置状态。
假设我还有一个异步操作,称为getHugeListFromServer(请求,成功,失败(,并使用参数getHugeListFromServer(startDate,endDate(调用。
每次用户选择一个日期时,我都想调用getHugeList函数并更新列表。如果我做这样的事情,它不起作用,因为在 reducer 设置日期变量之前调用后端操作。
example_container.jsx
class example extends React.Component {
... Methods
onChangeStartDate (startDate) {
this.props.setStartDate(startDate);
this.props.getHugeListFromServer(startDate, this.props.example.endDate);
}
// similar method for endDate.
}
我已经安装了 redux thunk,但它仍然对我的问题没有帮助。在调用后端操作之前,我考虑过使用 setDate 操作的化简器来返回承诺并在容器中解决它,但我敢打赌有更好的方法来解决这个问题。
有人可以下手吗?谢谢!
我想过让 setDate 操作的化简器在调用后端操作之前返回承诺并在容器中解决它,但我敢打赌有更好的方法来解决这个问题。
我不认为这听起来不合理。事实上,使用 redux,这可能完全没问题,并且可能是首选。
但是,如果需要,可以查看组件的一些生命周期方法,例如componentWillUpdate()
- 这将在每次状态即将更新时调用。因此,您可以保持处理程序原样,但只需从中删除this.props.getHugeListFromServer(...)
并将其放入componentWillUpdate()
钩子中 - 请查看下面的文档链接以查看如何实现它的示例。
https://developmentarc.gitbooks.io/react-indepth/content/life_cycle/update/tapping_into_componentwillupdate.html