2017-01-06 3 views
0

У меня есть Connector, у которого есть функции mapDispatchToProps и mapStateToProps, и мне нужно отправить действие из моего основного компонента.ReferenceError: Отправка не определена

Я получаю ошибку о том, диспетчерская не определен, когда я пытаюсь послать fetchPlaces(this.props.user.id)

this.props.user.id имеет значение 1.

Мне нужно, чтобы получить идентификатор пользователя и передать его в fetchPlaces, который intern получает меня местами пользователя. Я не знаю, как это сделать.

Разъем

const mapStateToProps = function (store) { 
 
    return { 
 
     elements: store.elements.elements, 
 
     places: store.places.places, 
 
     geocode : store.geocode.geocode, 
 
     user : store.user.user 
 
    }; 
 
}; 
 

 
const mapDispatchToProps = function (dispatch) { 
 
    return { 
 
     userAction : dispatch(fetchUser()), 
 
     elementsAction : dispatch(fetchCategories()), 
 
     placesAction: (id) => { dispatch(fetchPlaces(id)) }   
 
    } 
 
} 
 

 
class BasicinfoConnector extends React.Component{ 
 
    render() { 
 
     console.log(this.props.user); 
 
     if(typeof this.props.user.id != "undefined"){ 
 
      return (
 
       <Basicinfo elements={this.props.elements} places={this.props.places} geocode={this.props.geocode} user={this.props.user}/> 
 
     ); 
 
     } 
 
     else{ 
 
      return null; 
 
     } 
 
    } 
 
} 
 

 
export default Redux.connect(mapStateToProps, mapDispatchToProps)(BasicinfoConnector);

Компонент:

componentWillMount() { 
 
     console.log(this.props); 
 
     console.log(this.props.user.id); 
 
     dispatch(fetchPlaces(this.props.user.id)) 
 
    }

Является placesAction: (id) => { dispatch(fetchPlaces(id)) } правильный синтаксис делаешь g это?

UPDATE

Я изменил componentWillMount:

componentWillMount() { 
 
     console.log(this.props); 
 
     console.log(this.props.user.id); 
 
     dispatch(this.props.placesAction(this.props.user.id)) 
 
    }

и mapDispatchToProps:

const mapDispatchToProps = function (dispatch) { 
 
    return { 
 
     userAction: bindActionCreators(fetchUser, dispatch), 
 
     elementsAction: bindActionCreators(fetchUser, dispatch),   
 
     placesAction: (id) => { dispatch(fetchPlaces(id)) } 
 
    } 
 
}

Все те же ошибки.

+1

* "Мне нужно чтобы отправить действие из моего основного компонента ». * Вы бы назвали соответствующую опору для этого. Например. 'This.props.placesAction (this.props.user.id)'. Сам компонент не имеет доступа к 'dispatch', поэтому попытка вызвать его внутри компонента будет терпеть неудачу (как вы заметили). Btw, вы должны сразу назначить функции 'userAction' и' elementsAction', * not * call 'dispatch'. –

+0

Итак, что-то вроде 'placesAction: (id) => {dispatch (fetchPlaces (id))}' –

+0

У вас уже есть это и все правильно. –

ответ

1

Вы должны передать имущество вплоть до следующего уровня, либо путем обмена все реквизита, как это:

<Basicinfo {...this.props} /> 

или только отдельные из них, которые вы хотите

<Basicinfo placesAction={(id) => this.props.placesAction(id)} />