Запутался в mapStateToProps - PullRequest
       11

Запутался в mapStateToProps

0 голосов
/ 27 октября 2019

Я пытаюсь заставить редукс корректно работать с моим приложением. Кажется, работает в некоторой степени. Однако функция рендеринга, похоже, не обновляется при получении данных.

Пытаясь проверить это, я сделал следующее:

const mapStateToProps = (state, ownProps) => {
        console.log(state.correct_property_name)
        console.log(state)
    return {
        data: state.correct_property_name
    };
};

В этом случае console.log дляcorrect_data_name возвращается как пустой массив: []. Диспетчер, похоже, не вызывается вообще.

Однако, если я изменю последнюю строку в приведенном выше коде на неправильное имя свойства, console.log действительно работает, диспетчер вызывается, но мой рендерфункция не перезагружается:

const mapStateToProps = (state, ownProps) => {
        console.log(state.correct_property_name)
        console.log(state)
    return {
        data: state.wrong_property_name
    };
};

Вопрос:

Почему изменение последней строки на неправильное имя свойства внезапно приводит к тому, что console.log показывает данные?

Вот остальные строки в файле, если это полезно:

const mapDispatchToProps = (dispatch, ownProps) => ({
    fetchData() {
        dispatch(mySpecialActions.fetchMySpecialData());
    }
});

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

Действия:

import Axios from 'axios';

const apiUrl = '/api/my_data/';
export const fetchMySpecialDataSuccess = (correct_property_name) => {
  return {
    type: 'FETCH_MY_SPECIAL_DATA_SUCCESS',
    correct_property_name
  }
};


export const fetchMySpecialData = () => {

  console.log("TEST ONE")
  return (dispatch) => {
        console.log("DISPATCH")
    return Axios.get(apiUrl)
      .then(response => {
        console.log("DATA")

        dispatch(fetchMySpecialDataSuccess(response.data))
      })
      .catch(error => {
        console.log("ERROR")
        console.log(error)
        throw(error);
      });
  };
};

Комментарии в действияхОтображение только файла, если я установил последнюю строку в моем главном файле на data: state.incorrect_property_name. Для меня это говорит о том, что это даже не вызывает действие, когда я указываю правильное имя свойства. Но вызывает действие, когда я указываю ложное имя свойства.

Reducer:

import * as actionTypes from '../actions/actionTypes'

export const mySpecialDataReducer = (state = [], action) => {
  switch (action.type) {
    case actionTypes.FETCH_MY_SPECIAL_DATA_SUCCESS:
          return action.correct_property_name;
    default:
        console.log("DEFAULT STATE")
          return state;
  }
};
...