React-redux 调度程序未连接答案

【问题标题】：React-redux dispatcher not being connectedReact-redux 调度程序未连接
【发布时间】：2019-01-04 16:17:04
【问题描述】：

我有一个需要调用动作调度程序的组件，但是当我触发它时，我得到一个“未定义不是函数”错误。

我正在使用 react-redux、redux-persist 和 redux-thunk。

调用时我的所有其他操作都可以正常工作。

UserActions.js

export const updateProfile = (user, token) => {
  return async dispatch => {
    try {
      axios()
        .then(response => {
          getUpdateProfileSuccess(response.data, dispatch);
        })
        .catch(error => {
          getUpdateProfileError(error.response, dispatch);
        });
    } catch (error) {
      getUpdateProfileError(error.response, dispatch);
    }
  };
};

const getUpdateProfileSuccess = (data, dispatch) => {
  dispatch({
    type: UPDATE_PROFILE_SUCCESS,
    data
  });
};

const getUpdateProfileError = (error, dispatch) => {
  dispatch({
    type: UPDATE_PROFILE_ERROR,
    error
  });
};

我的组件.js

import...
import { updateProfile } from "../../../../Actions/UserActions";

class CardInfo extends Component {
  _handleUpdateProfile = () => {
    let user = {...};
    this.props.updateProfile(user, this.props.token);
  }
  render() {
    return (...)
  }
}

const mapStateToProps = state => ({
  token: state.UserReducer.token,
  user_data: state.UserReducer.user_data
});

export default connect(
  mapStateToProps,
  { updateProfile }
)(CardInfo);

当我调试代码时，我得到这个错误：

消息：“updateProfile 未定义”

stack: "ReferenceError: updateProfile 未定义在评估处（在 CardInfo._this._handleUpdateProfile 处评估 (blob:http://localhost:8081/41e77cd1-d0ff-413b-a32f-dfca9ee6061e:151091:21)， :1:1) 在 Object.CardInfo._this._handleUpdateProfile [as onPress] (blob:http://localhost:8081/41e77cd1-d0ff-413b-a32f-dfca9ee6061e:151091:21) 在 Object.Basic._this._handlePress [as onPress] (blob:http://localhost:8081/41e77cd1-d0ff-413b-a32f-dfca9ee6061e:124999:21) 在 Object.touchableHandlePress (blob:http://localhost:8081/41e77cd1-d0ff-413b-a32f-dfca9ee6061e:46460:40) 在 Object._performSideEffectsForTransition (blob:http://localhost:8081/41e77cd1-d0ff-413b-a32f-dfca9ee6061e:45131:16) 在 Object._receiveSignal (blob:http://localhost:8081/41e77cd1-d0ff-413b-a32f-dfca9ee6061e:45060:14) 在 Object.touchableHandleResponderRelease (blob:http://localhost:8081/41e77cd1-d0ff-413b-a32f-dfca9ee6061e:44939:12) 在 Object.invokeGuardedCallbackImpl (blob:http://localhost:8081/41e77cd1-d0ff-413b-a32f-dfca9ee6061e:7899:16) 在 invokeGuardedCallback (blob:http://localhost:8081/41e77cd1-d0ff-413b-a32f-dfca9ee6061e:7990:37) 在 invokeGuardedCallbackAndCatchFirstError (blob:http://localhost:8081/41e77cd1-d0ff-413b-a32f-dfca9ee6061e:7994:31)"

【问题讨论】：

我会检查两次这是否是正确的路径 "../../../../Actions/UserActions" 因为正如您所说的那样，文件似乎甚至没有相同的名称（Action.js 和 UserActions）。跨度>
@CrazyBarney 这是正确的道路，对不起，我错过了这个名字。
你能试试export default connect(mapStateToProps, mapDispatchToProps)(CardInfo); 和const mapDispatchToProps = (dispatch) => { return { updateProfile: ((user, token) => dispatch(updateProfile(user, token)) }; };

标签： javascript reactjs react-native redux

【解决方案1】：

AFAIK 你应该添加props 作为构造函数的参数。

class CardInfo extends Component {
  constructor(props) {
    super(props);
  }
  ...
}

【讨论】：