【问题标题】:Destructuring Actions in Nested Redux Reducer嵌套 Redux Reducer 中的解构操作
【发布时间】:2019-11-16 20:50:36
【问题描述】:

我正在调度一个如下所示的操作:

{ type: "TOGGLE_FARA", fara: true, id: "5d20d019cf42731c8f706db1" }

“id”仅用于识别正确的用户。该操作旨在修改我的“fara”状态的“启用”属性。我商店的 fara 部分如下所示:

{
   fara: {
     enabled: false, // This need to be flipped...
     names: []
   },
   senators: {
      enabled: false,
      names: []
   },
   senateCandidates: {
      enabled: false,
      names: []
   }
}

但是,我不确定如何构造我的减速器。我只想更改“启用”属性。我尝试了几种不同的方法:

export default (state = DEFAULT_STATE, action) => {
    switch (action.type) {
      case "INITIALIZE_SETTINGS":
        return {
          fara: action.fara,
          senators: action.senators,
          senateCandidates: action.senateCandidates,
          emails: action.emails
        }
      case "TOGGLE_FARA":
        return {
          ...state,
          // fara['enabled']: action.fara <–– This won't compile...
          // 'fara.enabled' : action.fara <–––This just gives me a key name with the string 'fara.enabled' 
        }
      default:
        return state;
      }

我打算做这样的事情,但这会直接修改你不应该做的状态(我的 redux 工具扩展说状态是相同的,这并不理想)。有什么想法吗?

export default (state = DEFAULT_STATE, action) => {
    switch (action.type) {
      case "INITIALIZE_SETTINGS":
        return {
          fara: action.fara,
          senators: action.senators,
          senateCandidates: action.senateCandidates,
          emails: action.emails
        }
      case "TOGGLE_FARA":
        state.fara.enabled = action.fara;
        return {
           ...state
        };
      default:
        return state;
      }

【问题讨论】:

    标签: javascript reactjs ecmascript-6 redux state


    【解决方案1】:

    这将起作用:

    return {
              ...state,
              fara: { ...state.fara, enabled: action.fara }
            }
    

    而且显然是在Redux documentation

    【讨论】:

    • 抱歉,我最初输入的“默认”状态是错误的。 “fara”键是我的“设置”对象中的一个键,这就是我遇到困难的原因......
    • @HarryCrame
    • 嗯,不完全...我只是试图澄清初始状态。这是一个很大的对象,其中 fara 是一个键。不要以为您提供的目标是“fara”专门...我想象它看起来像: { ...state, fara: /// 这里有什么? }
    • @HarryCramer 好像我混淆了“fara”和设置,但它应该可以正常工作
    猜你喜欢
    • 2018-06-03
    • 2020-12-05
    • 2020-03-14
    • 1970-01-01
    • 2019-09-03
    • 1970-01-01
    • 2017-08-08
    • 2018-02-15
    • 2018-08-12
    相关资源
    最近更新 更多