MapDispatchToProps 在返回对象时不起作用

IT技术 reactjs react-redux
2022-07-20 01:55:40

如果我制作自己的mapDispatchToProps函数，它就不起作用。如果我为连接提供一个普通对象，那么它确实可以工作，但我需要调度功能..例如每页加载翻译，我在这里做错了吗？

const mapStateToProps = (state) => { 

    const { isFetching, lastUpdated, items, errors } = state.transactions; // fetch from redux state ;)

    return {
        translate: getTranslate(state.locale),
        isFetching,
        lastUpdated,
        items,
        errors
    }
} 
const mapDispatchToProps = dispatch => {

    return { 
        fetchTransactionsIfNeeded, 
        invalidateList 
     }
}
export default connect(mapStateToProps, mapDispatchToProps)(Transactions);

下面的代码有效

const mapStateToProps = (state) => { 

    const { isFetching, lastUpdated, items, errors } = state.transactions; // fetch from redux state ;)

    return {
        translate: getTranslate(state.locale),
        isFetching,
        lastUpdated,
        items,
        errors
    }
} 

export default connect(mapStateToProps, { 
       fetchTransactionsIfNeeded, 
       invalidateList 
})(Transactions);
1个回答

根据redux文档

[mapDispatchToProps(dispatch, [ownProps]):dispatchProps] (Object or Function)：如果传递了一个对象，则假定其中的每个函数都是 Redux 动作创建者。具有相同函数名称的对象，但每个动作创建者都包装在一个调度调用中，以便可以直接调用它们，将被合并到组件的 props 中。

如果传递了一个函数，它将作为第一个参数被分配。您可以返回一个对象，该对象以某种方式使用 dispatch 以您自己的方式绑定动作创建者。（提示：你可以使用 Redux 的 bindActionCreators() 助手。）

在第一种情况下，当您实现 mapDispatchToProps 时，您将返回一个普通对象，但您需要在其中使用 dispatch，因为 redux 本身并不假定它是动作创建者。

你会像这样实现它

const mapDispatchToProps = dispatch => {

    return { 
        fetchTransactionsIfNeeded: (...args) => {
               dispatch(fetchTransactionsIfNeeded(...args))
         }, 
        invalidateList: (...args) => {
               dispatch(invalidateList(...args))
         },
     }
}

否则不要将它创建为一个函数，而只是一个对象

const mapDispatchToProps = { 
       fetchTransactionsIfNeeded, 
       invalidateList 
}
其它你可能感兴趣的问题
上一篇使用酶测试react下拉 下一篇使用react-hooks，用户如何根据管理员访问导航到受保护的路由