Normalizr with Redux 嵌套对象数组

Question

我刚开始在 Redux 中使用 normalizr，但无法正常工作。 尽管我可以用普通的 JavaScript.

我有一个对象数组

const data = [
  {
    data_detail: [
      {
        category: 'newCategory',
        _id: '123',
      },
    ],
    _id: 'abc_id',
    customer: {
      _id: '456',
      email: 'hello@gmail.com',
      name: 'Bob',
    },
    date: '2021-01-10T01:51:24.387Z',
  },
];

我需要将其转换为

const normalizedResponse = {
  customers: {
    '456': {
      _id: '456',
      email: 'hello@gmail.com',
      name: 'Bob',
    },
  },
  details: {
    '123': {
      category: 'newCategory',
      _id: '123',
    },
  },
  orders: {
   'abc_id: {
      order_detail: [123],
      _id: 'abc_id',
      customer: '456',
      date: '2021-01-10T01:51:24.387Z',
    },
  },
};

第 1 步：仅显示 orders

我的工作：

const userSchema = new schema.Entity(
  'orders',
  );

const userListSchema = new schema.Array(userSchema);


const normalizedData = normalize(data, userListSchema);

我得到了什么

{
  "entities": {
    "orders": {
      "abc_id": {
        "data_detail": [
          {
            "category": "newCategory",
            "id": "123"
          }
        ],
        "id": "abc_id",
        "customer": {
          "id": "456",
          "email": "hello@gmail.com",
          "name": "Bob"
        },
        "date": "2021-01-10T01:51:24.387Z"
      },
      "abc_id-02": {
        "data_detail": [
          {
            "category": "newCategory1",
            "id": "123-02"
          }
        ],
        "id": "abc_id-02",
        "customer": {
          "id": "456-02",
          "email": "hello@gmail.com",
          "name": "Bob"
        },
        "date": "2001-01-10T01:51:24.387Z"
      }
    }
  },
  "result": [
    "abc_id",
    "abc_id-02"
  ]
}

我想得到什么：

 orders: {
   'abc_id: {
      order_detail: [123],
      _id: 'abc_id',
      customer: '456',
      date: '2021-01-10T01:51:24.387Z',
    },
  },

问题：如何从订单中删除一些字段并添加新字段？

Answer 1

您的 data 对象中有 3 种不同的实体类型。首先为他们每个人起草一个schema：

const detail = new schema.Entity('details');

const customer = new schema.Entity('customers');

const order = new schema.Entity('orders');

然后回去填关系。看起来 order 是最外层的实体。 order 包含一个 details/categories 数组和一个 customer.

const order = new schema.Entity('orders', {
  data_detail: [detail],
  customer,
});

您的所有实体都使用 _id 而不是 id，因此您需要设置 idAttribute。

您的 data 是 order 的 array。您可以使用 new schema.Array(order)，但也可以只使用 [order].

这是您的最终代码：

const customer = new schema.Entity("customers", {}, { idAttribute: "_id" });

const detail = new schema.Entity("details", {}, { idAttribute: "_id" });

const order = new schema.Entity(
  "orders",
  {
    data_detail: [detail],
    customer
  },
  { idAttribute: "_id" }
);

const normalizedData = normalize(data, [order]);

这给你：

{
  "entities": {
    "details": { 
      "123": { 
        "category": "newCategory", 
        "_id": "123" 
        } 
      },
    "customers": {
      "456": { 
        "_id": "456", 
        "email": "hello@gmail.com", 
        "name": "Bob"
      }
    },
    "orders": {
      "abc_id": {
        "data_detail": ["123"],
        "_id": "abc_id",
        "customer": "456",
        "date": "2021-01-10T01:51:24.387Z"
      }
    }
  },
  "result": ["abc_id"]
}

Normalizr with Redux 嵌套对象数组

Normalizr with Redux with nested array of objects

redux

normalizr

react-redux