Предыдущее состояние, полученное редуктором, имеет неожиданный тип «Функция». Ожидаемый аргумент в качестве объекта со следующими ключами: «зарегистрировать»

Question

Так перевождь преобразователь дает мне эту ошибку (или, возможно, не Redux-преобразователь, но расширение)

The previous state received by the reducer has unexpected type of "Function". 
Expected argument to be an object with the following keys: "register" 

магазин

import { createStore, applyMiddleware } from 'redux'; 
import thunk from 'redux-thunk'; 
import reducers from './reducers'; 

const store = createStore(
    reducers, 
    applyMiddleware(thunk), 
    window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__() 
); 

export default store; 

редуктор

import { combineReducers } from 'redux'; 

import register from './register'; 

const reducers = combineReducers({ 
    register 
}); 

export default reducers; 

действие

import axios from 'axios'; 

export function changeDOB(payload) { 
    return dispatch => { 
     console.log('test'); 
    } 
} 

Но по какой-то причине, когда я удалить window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__() ошибка исчезает, я не знаю, почему расширение дает мне эту ошибку, но это выглядело, как будто я единственный, кто столкнулся с этим , Я искал в google и не могу найти ничего связанного с этой ошибкой.

Кстати, есть и еще одна ошибка, так OnLoad, что ошибка всплывает и когда я пытаюсь проверить действие, она производит следующее сообщение об ошибке:

Uncaught Error: Actions must be plain objects. Use custom middleware for async actions. 

, но когда я удалить эту часть window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__() я вижу a test на моей консоли, что означает, что действие было успешным (потому что это то, что он делает сейчас). Но мне нужна эта часть для целей развития, так как я могу с этим справиться. Я думаю, что я делаю что-то неправильно здесь.

Answer 1

Усилители вашего магазина настроены неправильно. applyMiddleware - пример усилителя хранилища. Усовершенствования хранилища - это функции более высокого порядка, которые добавляют пользовательские функции в магазин.

В принципе, все ваши энхансеры магазина, как ожидается, будут переданы через функцию композиции по тому же аргументу.

Compose используется, когда вы хотите передать несколько магазинов энхансеров в магазин. Усовершенствования хранилища - это функции более высокого порядка, которые добавляют некоторые дополнительные функции в магазин.

Чтобы сделать вещи проще, есть пакет NPM установить:

npm install --save redux-devtools-extension 

и использовать так:

import { createStore, applyMiddleware } from 'redux'; 
import { composeWithDevTools } from 'redux-devtools-extension'; 

const store = createStore(reducer, composeWithDevTools(
    applyMiddleware(...middleware), 
    // other store enhancers if any 
)); 

Вот альтернативный набор вверх от Redux документы, которые вы можете использовать если вы не хотите использовать инструменты decux dev, когда ваше приложение находится в производстве

import { createStore, combineReducers, applyMiddleware, compose } from 'redux'; 
import thunk from 'redux-thunk'; 
import * as reducers from '../reducers/index'; 

let reducer = combineReducers(reducers); 
let middleware = [thunk]; 

let finalCreateStore; 

// In production, we want to use just the middleware. 
// In development, we want to use some store enhancers from redux-devtools. 
if (process.env.NODE_ENV === 'production') { 
    finalCreateStore = applyMiddleware(...middleware)(createStore); 
} else { 
    finalCreateStore = compose(
    applyMiddleware(...middleware), 
    require('redux-devtools').devTools() 
)(createStore); 
} 

let store = finalCreateStore(reducer);