javascript - 如何使用 Normalizr 为递归模型定义模式

标签 javascript reactjs redux normalizr

尝试规范化负载时遇到一些问题,该负载包含与父级类型相同的嵌套模式,使用 Normalizr

例如,我有一个初始对象 (menu),它有一个子对象 (sections),它是一个对象数组 (section) , 这可以深入。

{
  id: 123,
  sections: [{
    id: 1,
    sections:[{ id: 4, sections: [ id: 5, sections: [] ] }]
  }, {
    id: 2,
    sections:[]
  }, {
    id: 3,
    sections:[]
  }]
}

我首先创建了一个 menu 模式,它在定义中包含链接到 sections 模式的部分,这在第一次通过时有效,但随后就不行了处理部分的子部分,因此我在 section 模式中添加了一个具有相同名称的后续定义(值得一试),但它没有用。

const section = new schema.Entity('sections')

const sections = new schema.Entity('sections', {
  sections: section
})

const menu = new schema.Entity('menu', { 
  sections: [ sections ]
})

section.define({ sections })

我希望以下面的对象结束:

{
  entities: {
    menu: {
      sections: [1, 2, 3]
    },
    sections: [{
      1: { id: 1, sections: [4] },
      2: { id: 2, sections: [] },
      3: { id: 3, sections: [] },
      4: { id: 4, sections: [5] },
      5: { id: 5, sections: [] },
    }]
  }
}

最佳答案

您的sections 架构应该是一个数组

const section = new schema.Entity('sections')
const sections = new schema.Array(section);
section.define({ sections });
const menu = new schema.Entity('menu', { sections });

然后,在使用它时......

const data = {
  id: 123,
  sections: [{
    id: 1,
    sections:[{ id: 4, sections: [ { id: 5, sections: [] } ] }]
  }, {
    id: 2,
    sections:[]
  }, {
    id: 3,
    sections:[]
  }]
};

normalize(data, menu)

将返回:

{
  "entities": {
    "sections": {
      "1": { "id": 1, "sections": [ 4 ] },
      "2": { "id": 2, "sections": [] }, 
      "3": { "id": 3, "sections": [] },
      "4": { "id": 4, "sections": [ 5 ] },
      "5": { "id": 5, "sections": [] }
    },
    "menu": {
      "123": { "id": 123, "sections": [ 1, 2, 3 ] }
    }
  },
  "result": 123
}

关于javascript - 如何使用 Normalizr 为递归模型定义模式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41506533/

相关文章:

javascript - React Typescript 映射循环接口(interface)错误

javascript - 使用 Redux 展开/折叠侧边栏

javascript - 覆盖现有的react.js类

reactjs - redux-form:在输入 onChange 后触发 Form onSubmit

javascript - 如何清除有值(value)的输入?

javascript - 使用redux-saga时,为什么yield语句是执行的值而不是undefined?

javascript - 使用对象属性的不同逻辑对 JS 对象进行序列化

javascript - 我有一个使用 Antd 的 React 组件,需要设置每隔一行的背景样式

javascript - 仅在 UIWebView 中的 img 内部缩放

javascript - 从 Javascript 调用 API 的安全方法?