0

我正在做一个项目,我想在下面的对象中更新我的数据我使用Lodash 的_.set 方法,所以将来这个下面的对象可以是任何东西,但像按钮和内容这样的子对象是相同的,因为这个东西是网站需要,它们是差异模板的差异。

"content_navData": {
  "path": ["content", "content_navData"],
  "logo": {
    "path": ["content", "content_navData", "logo"],
    "imgUrl": "https://source.unsplash.com/user/erondu/50x50",
    "settings": {
      "class": ["defaultLogo"]
    }
  },
  "navLinks": {
    "path": ["content", "content_navData", "navLinks"],
    "Home": {
      "path": ["content", "content_navData", "navLinks", "Home"],
      "title": "Home",
      "type": "link",
      "href": "/",
      "setting": {
        "class": ["defaultLink"],
        "isActive": true
      }
    },
    "About": {
      "path": ["content", "content_navData", "navLinks", "About"],
      "title": "About",
      "type": "link",
      "href": "/about",
      "setting": {
        "class": ["defaultLink"],
        "isActive": true
      }
    },
    "Blog": {
      "path": ["content", "content_navData", "navLinks", "Blog"],
      "title": "Blog",
      "type": "link",
      "href": "/blog",
      "setting": {
        "class": ["defaultLink"],
        "isActive": true
      }
    }
  },
  "navButtons": {
    "LogIn": {
      "title": "Log in",
      "type": "button",
      "setting": {
        "class": ["defaultButton", "ghostButton"],
        "isActive": true
      }
    },
    "SignUp": {
      "title": "Sign Up",
      "type": "button",
      "setting": {
        "class": ["defaultButton", "ghostButton"],
        "isActive": true
      }
    }
  }
},

我正在使用 react 和redux状态和数据管理,所以我不想为 diff 模板对象定义相同的 reducer。

正如您在此处看到的,我不想要reducer 的硬编码路径,所以我将我们path 键入每个具有该obj 正确路径的对象。我这是一个大项目的正确方法??

const componentReducer = (state = initialState, action) => {
  switch (action.type) {
    case componentEditType.EDIT_DESCRIPTION:
      return _.set(initialState, ['content', 'hero', 'data', 'description'], action.payload)
  }
}

4

0 回答 0