Я пытаюсь заставить редукс корректно работать с моим приложением. Кажется, работает в некоторой степени. Однако функция рендеринга, похоже, не обновляется при получении данных.
Пытаясь проверить это, я сделал следующее:
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;
}
};