Question

我试图了解redux，并对mapDispatchToProps有所疑问。

代码如下。

import * as actions  from '../../redux/actions';
import './style.scss'

class Center extends Component {
  componentDidMount() {
    this.props.getCenters();
  }

  ...
}
export default connect(state => ({
  ...state.center,
}),{
  ...actions,
})(Center);

动作文件的定义如下。

export const getCenters = () => ({
  type: types.CENTERS_REQUEST,
});

安装组件后，将调用this.props.getCenters（）并分派操作，一切都会按预期进行。

问题是，

getCenters的定义中没有提到调度。那么，如何在不分派动作的情况下调用该动作？

Answer 1

当您连接动作时，Redux会将调度注入（隐式地）到您的动作：

export default connect(state => ({
  ...state.center,
}),{
  ...actions,
})(Center);

如果稍微抽象一下，我们可以观察它的发生方式（明确地）：

function mapDispatchToProps(dispatch) {
    return {
        getCenters: () => dispatch(getCenters())
    }
}

export default connect(state => ({
  ...state.center,
}), mapDispatchToProps)(Center);

结果，getCenters具备了调度功能。

调用操作而不调度它-Redux

1 个答案: