this.props.dispatch不是函数.无法调度mapdispatchtoprops

Question

我一直在尝试调度一个函数，该函数将调用异步解析云函数。当我在函数中使用它们时，它在我的其他项目中运行得很好。但这是我第一次在组件中使用它们，当我调用从映射调度到道具的调度时，我会收到这个错误。请帮帮我。

ProfileHeader.js

import React, { Component } from 'react';
import Cover_Image from './Cover_Image.jpg';
import Profile_Pic from './Profile_Pic.svg';
import './ProfileHeader.css';
import { connect } from 'react-redux';
import { fetchUserProfile } from '../../Redux/UserProfile-Redux/UserProfileActionMethods';
class ProfileHeader extends Component {
componentDidMount() {
this.props.fetchUserProfile()
}
render() {
return (
<div className="profile-header-layout"></div>
)
}
}
const mapStatetoProps = (state) => {
return {
profile: state.UserProfile
}
}
const mapDispatchtoProps = (dispatch) => {
return {
fetchUserProfile: () => { dispatch(fetchUserProfile()) }, dispatch,
}
}
export default connect(mapDispatchtoProps, mapStatetoProps)(ProfileHeader)

行动方法：

import Parse from 'parse/dist/parse.min.js';
import { FETCH_USERPROFILE_FAILURE, FETCH_USERPROFILE_REQUEST, FETCH_USERPROFILE_SUCCESS } from './UserProfileActions';
const params = { username: "prvnngrj" }
export const fetchUserProfileRequest = () => {
return {
type: FETCH_USERPROFILE_REQUEST
}
}
export const fetchUserProfileSuccess = (userprofiles) => {
return {
type: FETCH_USERPROFILE_SUCCESS,
payload: userprofiles
}
}
export const fetchUserProfileFailure = (error) => {
return {
type: FETCH_USERPROFILE_FAILURE,
payload: error
}
}
export const fetchUserProfile = () => {
return async dispatch => {
dispatch(fetchUserProfileRequest)
try {
const responsedata = await Parse.Cloud.run("GetUserProfileForUsername", params);
const userprofiles = responsedata;
dispatch(fetchUserProfileSuccess(userprofiles))
}
catch (error) {
const errorMessage = error.message
dispatch(fetchUserProfileFailure(errorMessage))
}
}
}

请忽略不相关的代码部分，它直接来自项目

Answer 1

您混淆了参数的顺序，所以this.props.dispatch实际上就是您的状态！

您需要更改

export default connect(mapDispatchtoProps, mapStatetoProps)(ProfileHeader)

至：

export default connect(mapStatetoProps, mapDispatchtoProps)(ProfileHeader)

如果你可以切换到功能组件和useSelector/useDispatch挂钩，你应该这样做。这是目前推荐的方法，而且更易于使用。