代码之家 › 专栏 › 技术社区 › Nano

正在清理Redux状态

redux reactjs javascript

Nano · 技术社区 · 7 年前

在开始之前,我澄清我在提出这个问题之前读了很多书,甚至 How to reset the state of a Redux store? ,说,走吧。

我正在与React&合作;Redux是很久以前的事了,通常在创建状态时,我不会使用void新对象作为初始状态,而是创建一个结构化的初始状态,例如:

const initialState = {
  objectWithSomething: null,
  array: [],
  someString: ''
}
const someReducer = (state=initialState, action) => {
   switch(action.type) {
     case 'meh':
       // do something
       return { ...state, someString: ... }
   }
}

通常,当我想要清理状态时,只需要返回普通的initialState,仅此而已,但这种情况不同,因为我不理解状态是 部分清洁 喜欢只是重置了一些裸项,但没有清理数组、对象和其他一些嵌套项,这很奇怪,如果我将状态(在reducer中)与初始状态(常量)进行比较,它们是相同的,在某种程度上可能是我在改变状态还是什么?我不知道,但让我展示一下我的结构:

笔记 :这是一个要点,因为这是一个大而重复的文件(是一个测试,我正在尝试在任何优化之前采用某种新方法)。

reducer.js initialState.js

好吧,即使采用Dan Abramov在上述问题中暴露的方法,状态也不会很好地清洁,这是清洁后的状态(返回初始状态或使用Abramov方法):

newState.js

有人能给我一些线索、想法或什么吗?

1 回复 | 直到 7 年前

Diogo Sgrillo 7 年前

据我所知,你在多个地方改变了状态:

例子:

if (action.type === errors.GENERAL) {
    const errorsState = state.errors //errorState is a reference
    errorsState.general = action.payload //you mutate a property inside of it
    return { ...state, errors: errorsState } //and return the reference itself
}

相反,您应该:

if (action.type === errors.GENERAL) {
  const newErrorsState = {...state.errors, general: action.payload}
  return { ...state, errors: newErrorState }
}

推荐文章

Softly · 单选按钮未按预期取值

1 年前

Jason Owens · 我的html/javascript播放按钮无法播放嵌入的youtube视频

1 年前