mapStateToProps не присваивает состояние реквизитам - response-native / redux / firebase, - PullRequest
Новая
       20

mapStateToProps не присваивает состояние реквизитам - response-native / redux / firebase,

0 голосов
/ 01 мая 2019

Я получаю свое избыточное состояние в функции mapStateToProps, но это состояние не отображается на реквизиты и поэтому не может быть использовано в моем компоненте.

Я запустил console.log в функции mapStateToProps и получил данные обратно. Реквизиты не назначаются объекту / массиву состояний (у console.log есть возвращаемый массив).

HELP!

МОЙ КОМПОНЕНТ: 

componentDidMount() {
        this.props.onLoadHabits();
        console.log(this.props.habits)
        // undefined
    }

const mapStateToProps = state => {
    console.log(state.habits.habits)
    // returns an array with my two test objects included... [ Object, Object]
    return {
        habits: state.habits.habits
    }
}

const mapDispatchToProps = dispatch => {
    return {
        onLoadHabits: () => dispatch(getHabits())
    }
}

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

МОЕ ДЕЙСТВИЕ: 

export const getHabits = () => {
    return dispatch => {
        fetch("https://bestlyfe-b368a.firebaseio.com/habits.json")
            .catch(err => {
                console.log(err);
                alert('Something went wrong, sorry :(');
            })
            .then(res => res.json())
            .then(parsedRes => {
                const habits = [];
                for (let key in parsedRes) {
                    habits.push({
                        ...parsedRes[key],
                        key: key
                    })
                }
                console.log(habits);
                dispatch(setHabits(habits));
            })
    }
}

export const setHabits = habits => {
    return {
        type: SET_HABITS,
        habits: habits
    }
}

МОЙ РЕДУКТОР 

const habitsReducer = (state = initialState, action) => {
  switch (action.type) {
  case SET_HABITS:
      return {
        ...state,
        habits: action.habits
      }
 default:
      return state;
  }
};

export default habitsReducer;

Ответы [ 2 ]

0 голосов
/ 06 мая 2019

Спасибо за ответ, Малик, я понял, что моя проблема была в том, где я звонил console.log. Функция ComponentDidMount правильно присваивала состояние реквизитам, однако оно было доступно только в функции render () ... после монтирования и рендеринга компонента реквизиты были доступны для использования.

Надеюсь, это поможет людям!

0 голосов
/ 01 мая 2019

вы mapStateToProps не так. измените свой mapStateToProps ниже 

const mapStateToProps = state => {
    console.log(state.habits.habits)
    // returns an array with my two test objects included... [ Object, Object]
    return {
        //Change state.habits.habits to state.habitsReducer 
        habits: state.habitsReducer 
    }
}
...