我在以下 react-redux 代码中收到初始化错误

Question

我收到以下错误：Reducer“计数器”在初始化期间返回未定义如果传递给减速器的状态未定义，则必须显式返回初始状态。初始状态可能不是未定义的。如果你不想为这个 reducer 设置一个值，你可以使用 null 而不是 undefined。当我尝试组合 2 个减速器时会出现此错误。

import counterReducer from "./counter"
import loggedReducer from "./isLogged"
import {combineReducers} from "redux"

const allReducer = combineReducers({
    counterReducer,
    loggedReducer
})

export default allReducer

我的反减速器文件代码是：

const counterReducer = (state ={counter:0},action) =>{
    switch(action.type){
        case "INCREMENT":
            return state.counter + 1
        case "DECREMENT":
            return state.counter - 1    
    }
}
export default counterReducer;

我的 index.js 代码是：

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
// import "bootstrap/dist/css/bootstrap.min.css"
import App from './App';
import * as serviceWorker from './serviceWorker';
import {createStore} from "redux";
import allReducer from "./Reducers"

const store = createStore(allReducer);

运行最后一行时出现上述错误。

Answer 1

这被称为 Redux 初始化错误，它发生在 Redux 在应用程序的第一次挂载时触发多个分派时，它是第一次初始化。

从 reducer 工作原理背后的逻辑来看dispatch，redux 中的 Action 意味着告诉特定的 Reducer，其中的某些数据需要根据分派的 Action 类型/有效负载进行更改。

在 Reducer 中，我们通常通过在 JSswitch中提供一个与已调度的 Action 类型匹配的案例来捕获已调度的 Action ，我们执行逻辑，返回一个新状态以更新该 Reducer 中的状态。

既然这是 Redux 中 Action 和 Reducer 之间通信的正常流程和行为，而且我们现在知道 Redux 在第一次挂载时会触发一个 Initialization Action，那么我们提供什么情况来处理这个 Initialization Action？因为我们使用switch它必须是defaultjs的情况switch！

考虑default在每个 Reducer 的末尾添加一个case，以捕获特定 reducer 的所有非相关操作，例如初始化操作或应用程序周围的任何其他非处理操作。

假设您正在使用switch来控制减速器的行为：

switch(action.type){
  //..Some special cases you have written.
  // The next 3 lines fix the problem.. add it to the end of each of the reducers you have in your app.
    default: {
        return state;
    }
}