Redux объединяет редукторы с несколькими файлами - совершая простую ошибку

Question

Я пытаюсь настроить шаблон для объединения редукторов из нескольких файлов в соответствии с ответом @ gaearon (https://github.com/reduxjs/redux/issues/609#issuecomment-133903294),, но я делаю простую ошибку и не могу понять, что это такое. Имея некоторый мозг заблокировать на этом ...: \

Получение следующей ошибки:

Store does not have a valid reducer. Make sure the argument passed to combineReducers is an object whose values are reducers.

Мой код:

контейнеры / оценка / reducers.js

export const goals = (state = 0, action) =>
  action.type === types.UPDATE_GOALS ? action.payload : state

export const points = (state = 0, action) =>
  action.type === types.UPDATE_POINTS ? action.payload : state

контейнеры / время / reducers.js

export const minutes = (state = 0, action) =>
  action.type === types.UPDATE_MINUTES ? action.payload : state

export const seconds = (state = 0, action) =>
  action.type === types.UPDATE_SECONDS ? action.payload : state

контейнеры / index.js * ** 1022 тысяча двадцать-один * import * as score from './score' import * as time from './time' export default Object.assign({}, score, time) магазин / configureStore.js

import { createStore, combineReducers } from 'redux'
import reducers from '../containers'

const configureStore = initialState =>
  createStore(combineReducers(reducers), initialState)

export default configureStore

компоненты / provider.js

import configureStore from '../store/configureStore'
const initialState = { minutes: 55 }
const store = configureStore(initialState)

На больших базах кода недостаточно просто напрямую импортировать редукторы в файл configureStore. У вас есть эти огромные деревья состояний, для которых требуются сотни файлов редукторов, и многие редукторы импортируют другие редукторы из других файлов. В основном я спрашиваю, как управлять глубоко вложенным деревом состояний редукторов и комбинировать их друг с другом, используя import и export, пока они не достигнут корневой функции combineReducers.

Answer 1

Если объект, переданный в combReducer, пуст или недействителен, вы увидите эту ошибку.

Я всегда структурирую свои редукторы таким образом,

1. Я не отключаюсьОтдельный экспорт для каждого действия, объединение их в один экспорт и управление с помощью переключателей.
2. InitialState каждого редуктора определен внутри редуктора для простого управления кодом.

Я переписал вашкод немного:

контейнеры / счет / redurs.js

const initialState = {
  goals: 0,
  points: 0
};

const scoreReducer = (state = initialState, action) => {
  switch (action.type) {
    case UPDATE_GOALS:
      return { ...state, goals: action.payload };
    case UPDATE_POINTS:
      return { ...state, points: action.payload };
    default:
      return state;
  }
};
export default scoreReducer;

контейнеры / время / redurs.js

const initialState = {
  minutes: 0,
  seconds: 0
};

const timeReducer = (state = initialState, action) => {
  switch (action.type) {
    case UPDATE_MINUTES:
      return { ...state, minutes: action.payload };
    case UPDATE_SECONDS:
      return { ...state, seconds: action.payload };
    default:
      return state;
  }
};
export default timeReducer;

container / index.js

import score from './score';
import time from './time;
import { combineReducers } from "redux";
const rootReducer = combineReducers({
  score,
  time
});

export default rootReducer;

И после этого я не усложняю больше - я просто передаю провайдера и сохраняю его в свой основной компонент-обертку после определения комбинированногоРедукторы:

src / index.js

import React from 'react';
import ReactDOM from 'react-dom';
import { createStore } from 'redux';
import { Router } from 'react-router-dom';
import { Provider } from 'react-redux';
import rootReducer from './container';
import history from './history';
import App from './App';

const store = createStore(
  rootReducer
);

ReactDOM.render(
  <Provider store={store}>
    <Router history={history}>
      <App />
    </Router>
  </Provider>,
  document.getElementById('root')
);

Я действительно думаю, что структурирование таким образом решит вашу проблему, пожалуйста попробуйте.

Answer 2

Похоже, что папки с результатами и временем не содержат файлов index.js.

Попробуйте добавить их или изменить файл container / index.js :

import * as score from './score/reducers.js'
import * as time from './time/reducers.js'