Question

我已经看到了两种实现mapDispatchToProps的方法

第一种方式：

function mapDispatchToProps(dispatch) {
  return { actionMapped: bindActionCreators(courseActions, dispatch) };
}

第二种方式：

function mapDispatchToProps(dispatch) {
  return { actionMapped: () => dispatch( courseActions() )};
}

哪个效率更高？有什么情况我应该使用特定的吗？其中之一是“推荐的”吗？

Answer 1

在连接Redux组件时，有几种有效的方法可以“绑定”动作创建者。这里有一些例子：

    import {action1, action2} from "myActions";
    import {bindActionCreators} from "redux";

    const mapDispatchToProps(dispatch) => {
        return {
            manuallyBoundAction : (...args) => dispatch(action1(...args)),
            autoBoundAction : bindActionCreators(action2, dispatch),
            multipleActionsTogether : bindActionCreators({action1, action2}, dispatch)
        }
    };

    const MyComponent = (props) => {
        return (
            <div>
                <button onClick={props.manuallyBoundAction}>Run First Action</button>
                <button onClick={props.autoBoundAction}>Run Second Action</button>
                <button onClick={props.multipleActionsTogether.action1}>Run Third Action</button>
                <button onClick={props.multipleActionsTogether.action2}>Run Fourth Action</button>
            </div>
        )
    }

    export default connect(null, mapDispatchToProps)(MyComponent);

    // or, you can use the "object shorthand" for mapDispatch:
    export default connect(null, {action1, action2})(SomeOtherComponent)

所有这些最终都导致包装了动作创建者的函数，并在调用时自动将其返回值传递给dispatch()。

我个人建议使用“对象简写”方法。对我而言，从来没有充分的理由手动编写实际的mapDispatch函数。

Answer 2

如果mapDispatchToProps是操作的对象，则将操作对象作为connect(mapStateToProps, courseActions)参数传递到connect method会更容易：

如果传递了一个对象，则假定该对象内部的每个函数都是一个 Redux动作创建者。具有相同功能名称但具有每个动作创建者都包裹在调度调用中，因此他们可能是直接调用，将合并到组件的道具中。

示例：

dipsatch

bindActionCreators的作用相同，但是您需要显式传递const mapDispatchToProps =(dispatch) => bindActionCreators(courseActions, dispatch)：

grails.plugin.springsecurity.filterChain.chainMap = [
    //Stateless chain
    [
            pattern: '/**',
            filters: 'JOINED_FILTERS,-anonymousAuthenticationFilter,-exceptionTranslationFilter,-authenticationProcessingFilter,-securityContextPersistenceFilter,-rememberMeAuthenticationFilter'
    ],

    //Traditional, stateful chain
    [
            pattern: '/stateful/**',
            filters: 'JOINED_FILTERS,-restTokenValidationFilter,-restExceptionTranslationFilter'
    ]
]

如何在Redux上正确实现mapDispatchToProps？

2 个答案: