Question

所以我的应用程序中有这种简化的结构：

在组件中我有：

   handlePageClick(data) {
        this.props.onChangePage(data.selected + 1);
        this.props.onSearchSomething(this.props.PM);
    }

在我的容器中：

const mapDispatchToProps = dispatch => ({
    onUpdateForm: (propPath, val) => {
        dispatch(updatePMForm(propPath, val));
    },
    onSearchSomething: (payload) => {
        // TODO: process the PM state here when integrating with the server in order to extract
        // the proper payload out of the state object
        dispatch(searchSomething(15, payload));
    },
    onChangePage: (pageNumber) => {
        dispatch(changePage(pageNumber));
    },
});

因此，当我触发pageClick，并且onChangePage返回newState时，在mapDispatchToProps dispatch（searchSomething（15，payload））中接收有效负载中的先前状态，但尚未更新。

Answer 1

您应该使用componentDidUpdate或componentWillUpdate并将之前的状态与当前状态区分开，然后使用商店中更新的值调用this.props.onSearchSomething，而不是在{{1}中逐个调用它}。这是为什么？组件中的状态更改可能是异步的，几乎在所有情况下，组件的道具都无法在handlePageClick和this.props.onChangePage调用之间更新。请阅读this issue以便更好地理解我在说什么。

但是为了帮助你一点时间，我创建了一个小实用程序map-props-changes-to-callbacks，将组件中的回调分配给redux store中的特定更改。也许这对你的情况很有用，你可以像这样编写你的代码：

this.props.onSearchSomething

此外，您应该考虑将逻辑移动到单个操作，这样您就可以调度一个操作并获得搜索结果。

Redux mapDispatchToProps没有获得适当的有效负载

1 个答案: