Инициализация начального состояния в React-Redux-приложении

335
21 сентября 2017, 18:03

Делаю приложение на React JS. Непонятная проблема с инициализацией начального состояния. В консоли при выполнении команды npm start выдается такое сообщение

 bundle.js:23330 Unexpected keys "date", "currencies" found 
 inpreloadedState argument passed to createStore. Expected to find one of 
 the known reducer keys instead: "currencyReducer". Unexpected keys will be  
  ignored.

actions.js:

   export const refreshDate = (date, currencies)  => ({
     type: 'REFRESH_DATE', date, currencies
 });

reducer.js:

 export const currencyReducer = (state, action) => {
   switch(action.type) {
      case 'REFRESH_DATE':
      let new_state = Object.assign({}, { date : action.date, currencies :       action.currencies} );
      console.log(new_state);
      return new_state;
       default:
         return state || { date : new Date(), currencies : [] };
       }
     };

фрагмент app.js:

  const iniState = { date : new Date, currencies : [] };  
  export const store = createStore(combineReducers(reducers), iniState,  
    applyMiddleware(refreshDate));

Что я делаю не так?

Answer 1

Аргумент preloadedState функции createStore (iniState) должен представлять из себя будущий стейт, который у Вас имеет такую структуру:

{
    currencyReducer: {
        date: new Date(), 
        currencies: []
    }
}

А Вы пытаетесь подсунуть ему

{ date : new Date(), currencies : [] }

На что явно указывает эта запись:

Unexpected keys "date", "currencies" found in preloadedState argument passed to createStore

READ ALSO
JS. Как получить statusText ответа?

JS. Как получить statusText ответа?

Если отправлять запрос к API через Postman, то он он рядом с кодом выводит статус-текст ответаЕсли же делать запрос из кода JS, то я не могу получить...

204
Как начать во front-end

Как начать во front-end

Прошу судить не слишком строго

221
Передача между компонентами во vue 2

Передача между компонентами во vue 2

Есть приложение с разбитыми на компоненты в разных файлах , используеться vue router , 1 компонент при нажатии на кнопку строит таблицу в зависимости...

244