React Redux无限循环更新-使用CombineReducers更新后开始出现问题

时间:2018-12-14 13:58:08

标签: javascript reactjs react-redux

好的,所以我会尝试总结一下。我已经修改了我的代码,使它有2个reducer而不是1个(为了更好地阅读),并且我开始遇到无限循环了。

redux道具似乎一直在更新,但是它们没有变化。

这是我的减速器文件。

import { ADD_LISTITEM } from "../constants/action-types.jsx";
import { SET_SPOTOKEN } from '../constants/action-types.jsx';
import { SET_LISTVIEW } from '../constants/action-types.jsx';
import { CHECK_SPOTOKEN } from '../constants/action-types.jsx';
import { SET_FORMPANEL } from '../constants/action-types.jsx';
import { SET_FORMPANELTYPE } from '../constants/action-types.jsx';
import { combineReducers } from 'redux'


const initialState = {
    listItems: [],
    spoToken: '',
    listView: "All Items",
    checkToken: "200",
    showNotice: true,
    //showFormPanel: false,
    //formPanelType: ''
};

const listState = {
    showFormPanel: false,
    formPanelType: ''
}
const rootReducer = (state = initialState, action) => {
    switch (action.type) {
        case ADD_LISTITEM:
            return { ...state, listItems: [...state.listItems, action.payload] };
        case SET_SPOTOKEN:
            return { ...state, spoToken: action.payload };
        case SET_LISTVIEW:
            return { ...state, listView: action.payload };
        case CHECK_SPOTOKEN:
            return { ...state, checkToken: action.payload };

        default:
            return state;
    }
};

const listReducer = (state = listState, action) => {
    switch (action.type) {
        case SET_FORMPANEL:
            return { ...state, showFormPanel: action.payload };
        case SET_FORMPANELTYPE:
            return { ...state, formPanelType: action.payload };
        default:
            return state;
    }
}

const allReducers = combineReducers({
    rootReducer,
    listReducer
});
export default allReducers;

知道为什么会引起问题吗?

使用Redux状态编辑->

{
    root: { … }, newItem: { … }, forms: { … }
} forms: {
    $form: { … }, newItem: { … }
} newItem: { Title: "", ItemID: "", OfferingID: "", DeliveryModality: "", Status: "", … }
root: listReducer: {
    showFormPanel: false, formPanelType: ""
} rootReducer: {
    listItems: Array(4), spoToken: { … }, listView: "All Items", checkToken: "200", showNotice: true
}

把上面的文字弄成文字,因为看起来有点混乱。

状态包含-> formsnewItemroot。根包含listReducerrootReducer

已修复:仅允许1 combineReducers

显然,由于我在添加此减速器之前没有使用其他减速器,因此我的redux格式文件中还有另一个combineReducers。我认为这是问题所在(具有2个combineReducers),因为修改后它似乎可以正常工作。

0 个答案:

没有答案