.dispatch is not a function

Question

组件1：

const mapDispatchToProps = (dispatch) => {
  return {
    currency: (data) => dispatch(currency(data)),
  }
}
const mapStateToProps = (state) => {
  return ({
      changeContent: state.changeContent
    }
  )
}


handleClick = (e, special) => {
    const { changeContent } = this.props;
    changeContent({type:'CHANGE',item:e.key})

};
export default connect((state, ownProps) => {
    return {
      menuList: state.menuList,
      userInfor: state.userInfor,
      menuKeys: state.menuKey,
      language: state.language,
    };
  }, mapStateToProps,
  mapDispatchToProps)(Container);

组件2：

//CommonList组件

render (){
    return (
        <div>{this.props.changeContent}</div>
)}
const changeContent =(state)=>({
    changeContent:state.changeContent
})
export default connect(changeContent)( Form.create({})(CommonList))

reducer:

const changeContent =  (state = [], action) =>{
  switch (action.type){
    case "CHANGE" :
      return ([...state, action.item])
    default:
      return state
  }
}
export default changeContent

运行就会报错，changeContent is not a function

Answer 1

你的Container这个组件里面确实没有this.props.changeContent呀，你要不是通过外面使用传过去<Container changeContent={...} />， 要不就在mapDispatchToProps = （dispatch） => （{ changeContent: function}）

Answer 2

你这样用不对，changeContent是一个reducer，你是想执行一个action直接使用
this.props.dispatch({type:'CHANG',item}),另外你的
const mapDispatchToProps = (dispatch) => {
return dispatch
}
就不会提示dispatch is not a function