Question

我让beeb使用redux东西，我们在其中传递mapDispatchToProps并在其中分发动作。这是我在大多数react-redux Web应用程序中遵循的模式。我遇到了这个代码库，开发人员在其中做了类似的事情。我列出了代码的所有基本部分。

import { fetchSportsFanDetails } from "./actions";
class Profile extends Component {
  componentDidMount() {
    if (!this.props.sportsFanDetails) {
      this.props.fetchSportsFanDetails();
    }
  }

  render() {
    const { classes, sportsFanDetails } = this.props;
    return (
      <div className={classes.rootStyle}>
        // some code
      </div>
    );
  }
}

const mapStateToProps = ({ user }) => ({
  sportsFanDetails: user.sportsFanDetails,
  isFetchingSportsFanDetails: user.isFetchingSportsFanDetails
});
export default connect(
  mapStateToProps,
  { fetchSportsFanDetails, logoutUser }
)(withStyles(styles)(Profile));

这是.js动作

export const fetchSportsFanDetails = () => ({
  type: FETCH_SPORTS_FAN_DETAILS_REQUEST
});

这是如何工作的？ Iam习惯了

function mapStateToProps(state) {
    return {
        funds: state.funds
    };
}

function mapDispatchToProps(dispatch) {
    return {
        getAllFunds: (options = {}) => {
             console.log('Inside dispatch');
            dispatch(getAllFunds(options));
        }
        ,  getAllFundsOnSearch: (options = {},data) => {
            dispatch(getAllFundsOnSearch(options,data));
        }

    };
}

，然后调用this.props.getAllFiundsOnSearch（）。请注意，我们正在使用redux-saga。

Answer 1

从docs和source code出发：

如果传递的对象包含动作创建者而不是函数，则connect会在内部自动为您调用bindActionCreators。假设mapDispatchToProps对象的每个字段都是动作创建者

困惑如何在React Redux中调度动作

1 个答案: