Ошибка в mapStateToProps () при получении объекта json в Redux - PullRequest
Новая
       25

Ошибка в mapStateToProps () при получении объекта json в Redux

0 голосов
/ 27 мая 2018

Я пытаюсь получить данные с моего сервера Express в Redux и сопоставляю объекту только один массив, называемый «витаминами».Это объект JSON.

 router.get('/', function(req, res, next) {
  vitamins: [
     {
        name: "Vitamin B2"
     }
  ],
  minerals: [
    {
       name: "Zinc"
    }
  ]});
 });

Это мой файл action.js, в котором я создаю функцию fetchVitamins (), чтобы просто получать micros.vitamins. 

export function fetchVitamins() {
return dispatch => {
  return fetch("/users")
    .then(res => res.json())
    .then(micros => {
       dispatch(fetchVitaminsSuccess(micros.vitamins));
       return micros.vitamins;
    })
  };
}

export const FETCH_VITAMINS_SUCCESS = 'FETCH_VITAMINS_SUCCESS';

export const fetchVitaminsSuccess = vitamins => ({
  type: FETCH_VITAMINS_SUCCESS,
  payload: { vitamins }
});

Это мой redurs.js 

 const initialState = {
   micros: [],
 };

function vitaminReducer(state = initialState, action) {
  switch(action.type) {
  case FETCH_VITAMINS_SUCCESS:
   return {
     ...state,
     micros: action.payload.vitamins
   };
  default:
    return state;
  }
}

Это мой компонент React Vitamins.js, в который я импортирую fetchVitamins () и пытаюсь передать названия каждого витамина в раскрывающемся меню в теге опции. 

componentDidMount() {
  this.props.dispatch(fetchVitamins());
}

renderData() {
   const { vitamins } = this.state.micros;
   return vitamins.map((micro, index) => {
      return (
        <option value={micro.value} key={index}>{micro.name}</option>
      )
   })
 } 

 render() {
   return (
      <select value={this.props.value}>
        {this.renderData()}
      </select>
   )
 }

 const mapStateToProps = state => ({
    micros: state.micros.vitamins,
 });

Прямо сейчас, когда он рендерится, я получаю эту ошибку: «Ошибка TypeEr: не могу прочитать свойство« витамины »неопределенного», выделяя «micros: state.micros.vitamins,».

Правильно ли я вызываю и устанавливаю состояние?Если я установлю свой initialState на micros: [], тогда установка «state.micros.vitamins» должна работать, подумал я.

1 Ответ

0 голосов
/ 28 мая 2018

из-за того, что вы получаете от сервера данные n объектов витаминов, чтобы данные были в витаминах: [], в этом формате, чтобы выяснить, почему работает state.macros.vitamins.

...