Redux 嵌套数据规范化createEntityAdapter

我正在尝试规范化以下结构的数据数组

array

。使用

createEntityAdapter

在使用

createAsyncThunk

获取数据并返回它们之后，我在

extraReducers

中设置了它们，如下所示：

applicationsAdapter.setAll(state, action.payload)

{
    applications: {
      ids: [
        '60a684fb90957536f185ea88',
      ],
      entities: {
        '60a684fb90957536f185ea88': {
          id: '60a684fb90957536f185ea88',
          title: 'Article1',
          description: 'The best article ever',
          groups: [
            {
              id: 'bPDGd8uOkmKKAO3FyoTKE',
              title: 'Group 1',
              voters: [
                {
                  user: {
                    uid: '344bc9b8-671b-4de5-ab2d-a619ea34d0ba',
                    username: 'tran',
                  },
                  vote: 'DECLINED'
                }
              ]
            }
          ],
          deadline: "2021-05-20",
          budget: 0,
          createdAt: '2021-05-20',
          createdBy: {
            uid: 'ab2a8f19-c851-4a5f-9438-1000bfde205a',
            username: 'admin',
          },
     },
}

在Redux开发工具中，我可以看到数据如下所示：

applicationsAdapter.setAll(state, action.payload)

{
    applications: {
      ids: [
        '60a684fb90957536f185ea88',
      ],
      entities: {
        '60a684fb90957536f185ea88': {
          id: '60a684fb90957536f185ea88',
          title: 'Article1',
          description: 'The best article ever',
          groups: [
            {
              id: 'bPDGd8uOkmKKAO3FyoTKE',
              title: 'Group 1',
              voters: [
                {
                  user: {
                    uid: '344bc9b8-671b-4de5-ab2d-a619ea34d0ba',
                    username: 'tran',
                  },
                  vote: 'DECLINED'
                }
              ]
            }
          ],
          deadline: "2021-05-20",
          budget: 0,
          createdAt: '2021-05-20',
          createdBy: {
            uid: 'ab2a8f19-c851-4a5f-9438-1000bfde205a',
            username: 'admin',
          },
     },
}

问题： 数据没有完全标准化。如何规范组、投票者和用户对象

以下是接口：

export interface Application {
    id: string;
    title: string;
    description: string;
    groups: Array<GroupElement>;
    deadline: string;
    budget?: number;
    createdAt: string;
    createdBy: User;
}


export interface GroupElement {
    id: string;
    title: string;
    voters: Array<Voter>;
}

export interface User {
    uid: string;
    username: string;
}

export interface Voter {
    user: User;
    vote: Decision;
}

导出接口应用程序{
id：字符串；
标题：字符串；
描述：字符串；
组：阵列；
截止日期：字符串；
预算？：数字；
createdAt:string；
createdBy：用户；
}
导出接口GroupElement{
id：字符串；
标题：字符串；
投票人：数组；
}
导出接口用户{
uid：字符串；
用户名：字符串；
}
导出接口投票者{
用户：用户；
表决：决定；
}

createEntityAdapter

本身不执行任何类型的关系规范化。你需要使用它

这是一个很难正常化的问题，因为

投票者
对象缺少自己的id属性。我得把一个拼凑起来

import { schema, normalize } from "normalizr";

const user = new schema.Entity("user", {}, { idAttribute: "uid" });

const voter = new schema.Entity(
  "voter",
  {
    user: user
  },
  {
    idAttribute: (object) => `${object.vote}-${object.user.uid}`
  }
);

const group = new schema.Entity("group", {
  voters: [voter]
});

const application = new schema.Entity("application", {
  createdBy: user,
  groups: [group]
});

normalize(entity, application);

将您的数据转换为：

{
  "entities": {
    "user": {
      "ab2a8f19-c851-4a5f-9438-1000bfde205a": {
        "uid": "ab2a8f19-c851-4a5f-9438-1000bfde205a",
        "username": "admin"
      },
      "344bc9b8-671b-4de5-ab2d-a619ea34d0ba": {
        "uid": "344bc9b8-671b-4de5-ab2d-a619ea34d0ba",
        "username": "tran"
      }
    },
    "voter": {
      "DECLINED-344bc9b8-671b-4de5-ab2d-a619ea34d0ba": {
        "user": "344bc9b8-671b-4de5-ab2d-a619ea34d0ba",
        "vote": "DECLINED"
      }
    },
    "group": {
      "bPDGd8uOkmKKAO3FyoTKE": {
        "id": "bPDGd8uOkmKKAO3FyoTKE",
        "title": "Group 1",
        "voters": ["DECLINED-344bc9b8-671b-4de5-ab2d-a619ea34d0ba"]
      }
    },
    "application": {
      "60a684fb90957536f185ea88": {
        "id": "60a684fb90957536f185ea88",
        "title": "Article1",
        "description": "The best article ever",
        "groups": ["bPDGd8uOkmKKAO3FyoTKE"],
        "deadline": "2021-05-20",
        "budget": 0,
        "createdAt": "2021-05-20",
        "createdBy": "ab2a8f19-c851-4a5f-9438-1000bfde205a"
      }
    }
  },
  "result": "60a684fb90957536f185ea88"
}

这太棒了！我肯定认为，
createEntityAdapter
进行了第一层规范化，因为我在其中有
id
和
实体
。在对数据进行规范化之后，是否将数据放入
createEntityAdapter
？这看起来如何（实现）？