Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/reactjs/27.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 在redux中更新多个值_Javascript_Reactjs_Redux - Fatal编程技术网

Javascript 在redux中更新多个值

Javascript 在redux中更新多个值,javascript,reactjs,redux,Javascript,Reactjs,Redux,我正在尝试更新redux中的嵌套对象,但不确定是否正确。下面提供的代码无法编译,因为减速器中存在语法错误 我知道这不是正确的语法,因为在action.payload之前没有键,但我不知道如何将action.payload合并到[action.id] 我试图避免为需要更新的每个密钥创建单独的操作(例如,updateBlockType,updateBlockTitle,updateBlockDescription,等等) 调度: this.props.dispatch(updateBlock(thi

我正在尝试更新redux中的嵌套对象,但不确定是否正确。下面提供的代码无法编译,因为减速器中存在语法错误

我知道这不是正确的语法,因为在
action.payload
之前没有键,但我不知道如何将action.payload合并到[action.id]

我试图避免为需要更新的每个密钥创建单独的操作(例如,
updateBlockType
updateBlockTitle
updateBlockDescription
,等等)

调度:

this.props.dispatch(updateBlock(this.props.id, { type: e.currentTarget.id }))
export function updateBlock (id, values) {
  return {
    type: 'UPDATE_BLOCK',
    id: id,
    payload: values
  }
}
case 'UPDATE_BLOCK':
  return {
    ...state,
      blocks: {
      ...state.blocks,
      byHash: {
        ...state.blocks.byHash,
        [action.id]: {
          ...state.blocks.byHash[action.id],
          action.payload <-- How do I merge the payload?
        }
      }
    }
  }
'1': { id: 1, type: 'INTRO', title: 'Some title...', description: 'Some description...' }
行动:

this.props.dispatch(updateBlock(this.props.id, { type: e.currentTarget.id }))
export function updateBlock (id, values) {
  return {
    type: 'UPDATE_BLOCK',
    id: id,
    payload: values
  }
}
case 'UPDATE_BLOCK':
  return {
    ...state,
      blocks: {
      ...state.blocks,
      byHash: {
        ...state.blocks.byHash,
        [action.id]: {
          ...state.blocks.byHash[action.id],
          action.payload <-- How do I merge the payload?
        }
      }
    }
  }
'1': { id: 1, type: 'INTRO', title: 'Some title...', description: 'Some description...' }
减速器:

this.props.dispatch(updateBlock(this.props.id, { type: e.currentTarget.id }))
export function updateBlock (id, values) {
  return {
    type: 'UPDATE_BLOCK',
    id: id,
    payload: values
  }
}
case 'UPDATE_BLOCK':
  return {
    ...state,
      blocks: {
      ...state.blocks,
      byHash: {
        ...state.blocks.byHash,
        [action.id]: {
          ...state.blocks.byHash[action.id],
          action.payload <-- How do I merge the payload?
        }
      }
    }
  }
'1': { id: 1, type: 'INTRO', title: 'Some title...', description: 'Some description...' }

我构造减速机的方法可能是错误的,因此我对如何解决这个问题持开放态度。

您错过了扩展运算符:
…action.payload
,它将对象的有效负载属性扩展到减速机中的对象条目

如果结构变得更复杂,最好将减缩器组合成子减缩器,并将它们与来自redux的thr
combinereducer
api合并


此外,您正在访问减速机中的
state.blocks
state.blocks.hash
。如果初始状态未定义这些键,则可能引发错误。这是组成复杂还原剂的另一个原因。

非常感谢。感觉这是我最终完全理解排列运算符时遗漏的部分;)