Данные с хранилища не вытягиваются с стора. В чем может быть причина?

Question

[rsoinvi]

Данные парсяться с json

import React, { Component } from 'react';
import { fetchData } from '../../actions/fetchData';
import { loader } from '../loader/loader';
import { connect } from 'react-redux'

class App extends Component {
  render(){
    this.props.getFetchData()
    return (
      <div className="App">
        {this.props.data}
      </div>
    );
  }
}

const mapStateToProps = state => {
  return {

    name: this.state && this.state.name
  }
}

const mapDispatchToProps = dispatch => {
  return {
    getFetchData: () => {
      dispatch(fetchData())
    }
  }
}

export default connect(mapStateToProps, mapDispatchToProps)(App);

Answer 1

[Антон Спирин]

В чем может быть причина?

Видимо, в плохом знании JavaScript и невнимательности.

const mapStateToProps = state => {  // принимаем аргумент
  return {
    name: state && state.name,  // используем аргумент
  };
};

Короткий вариант записи:

const mapStateToProps = state => ({
  name: state && state.name,
});

Вот контекст стрелочной функции, объявленной в глобальном скоупе.
Вот к чему обращались вы, вместо аргумента state.

Серверные запросы делают в componentDidMount и componentDidUpdate. Почитать на эту тему.

Comments

[Максим]

Антон Спирин componentDidUpdate еще актуально в последних версиях 16.3 / 16.4?

[Антон Спирин]

Максим, да, этот метод никуда не денется.
Устаревшие методы:
1. componentWillMount, вместо него componentDidMount
2. componentWillUpdate, вместо него componentDidUpdate
3. componentWillReceiveProps, тут альтернатива статический метод getDerivedStateFromProps
Использовать старые методы можно будет до следующей мажорной версии(17).
Но лучше, конечно, по возможности, переписать на новые.

[Максим]

Антон Спирин, я редко очень cdu использую, хотя как-то раз в твиттере мне советовали. У вас какие-то есть примеры его использования под рукой для расширения кругозора?

[Антон Спирин]

Максим, в документации хороший пример:

componentDidUpdate(prevProps) {
  // Typical usage (don't forget to compare props):
  if (this.props.userID !== prevProps.userID) {
    this.fetchData(this.props.userID);
  }
}

Как раз в подобных случаях и использовал. Например, при смене пользователя на странице канала через логин popup, подтягиваются мета данные: подписан ли он на канал, следит ли за новостями.