React Redux ошибка mapDispatchToProps

Я пытаюсь применить mapDispatchToProps вместо действия Dispatch, но я получил сообщение об ошибке, кто-нибудь поможет? Табкью

mapDispatchToProps () в Connect (ButtonGroup) должен возвращать простой объект. Вместо этого получил undefined.


Создатель действий

function clickDisable() {
  return {
      type: 'CLICK_DISABLE'
  }
}

Компонент

var ButtonGroup = React.createClass({


     clickAdd(event) {  
            this.props.dispatch(clickAdd());  
        }  ,

    clickSub(event) {  
            this.props.dispatch(clickSub());  
        }  ,
    /*clickDisable(event) {  
            this.props.dispatch(clickDisable());  
        }  ,*/

  render() {

      const { age } = this.props;     

        return (
          <ButtonToolbar style = {{width: 17+ 'em'}} >
          <Button  id = "search"   style = {{width: 5 + 'em'}}>{age}</Button>
          <Button  onClick = {this.clickAdd} style = {{width: 5 + 'em'}}>Createa</Button>
          <Button  onClick = {this.props.clickDisable} style = {{width: 5 + 'em'}}>Detele</Button>
          </ButtonToolbar> 
        );
      }
});

mapDispatchToProps

 function mapDispatchToProps (dispatch) {
        return Redux.bindActionCreators({
            clickDisable: clickDisable
      }, dispatch);
     }

    function mapStateToProps(state) {  
        return {  
            age: state.reducreForAge.age
        }  
    }  

Соединять

  const NewButtonGroup = connect(mapStateToProps,mapDispatchToProps)(ButtonGroup);

Какая строка вызывает ошибку? Все в коде, который вы здесь показываете, выглядит нормально.

Code-Apprentice 15.08.2018 06:36

с первого взгляда выглядит хорошо. Не могли бы вы сделать из своего кода рабочий код и ящик?

Prasanna 15.08.2018 07:04
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
0
2
193
1

Ответы 1

Используйте это в mapDispatchToProps. Все остальное выглядит нормально.

const mapDispatchToProps = dispatch =>  { return{
clickDisable: () => dispatch({type:'CLICK_DISABLE'})};};

Ваш ответ должен давать точное поведение как код OP.

Code-Apprentice 15.08.2018 06:37

Другие вопросы по теме