我在React应用程序中使用Redux进行状态管理 . 我还打算“压扁”任何API响应,以鼓励重用并减少状态树中的数据重复 . 我希望使用Normalizr来实现这一目标 .
我的问题是管理对象之间关系的首选方式 - 特别是继承类型关系 .
应用程序向API发出请求(后端用Java编写,Spring) . 已定义的域模型包括以下关系:
interface NamedThing {
int getId();
String getName();
}
interface Pet extends NamedThing {
Person getOwner();
}
class Cat implements Pet {
int getId() {
...
};
String getName() {
...
};
Person getOwner() {
...
};
int getNumberOfLivesRemaining() {
…
};
}
class Dog implements Pet {
int getId() {
...
};
String getName() {
...
};
Person getOwner() {
...
};
int getAgeInDogYears() {
…
};
}
class Person implements NamedThing {
int getId() {
...
};
String getName() {
...
};
}
对/ pets endpoints 的GET请求的响应可能如下所示:
[{
id: 1,
type: ‘cat',
name: ‘Fluffy',
owner: {
id: 1,
name: ‘Mary'
},
numberOfLivesRemaining: 9
},
{
id: 2,
type: ‘dog',
name: ‘Ralph',
owner: {
id: 1,
name: ‘Mary'
},
ageInDogYears: 10
}]
在定义了正确的模式后,Normalizr会将响应变平如下:
{
result: [
{id: 1, schema: ‘cats’},
{id: 2, schema: ‘dogs’}
],
entities: {
cats: {
1: {
id: 1,
type: ‘cat’,
name: ‘Fluffy’,
owner: 1,
numberOfLivesRemaining: 9
}
},
dogs: {
2: {
id: 2,
type: ‘dog',
name: ‘Ralph',
owner: 1,
ageInDogYears: 10
}
},
persons: {
1: {
id: 1,
name: ‘Mary’
}
}
}
}
方法1:
不同的实体(猫,狗和人)可以在应用程序状态中存储在类似命名的集合中 . 然而,我会失去猫和狗是宠物的细节,我知道这是因为我打电话给宠物终点 .
方法2:
我可以将所有宠物实体存储在宠物收藏中,并将所有猫的ids和所有狗的ID存储在不同的收藏中 . 然后,我可以通过使用React-Redux mapStateToProps函数将所有猫,所有的狗或所有宠物传递到组件中进行相应的过滤 .
但是,如果我向/ namedThings endpoints 发出GET请求,我会让猫,狗和人返回并将它们存储在namedThings集合中,其中包含猫,狗和人的ID . 但是,我不知道猫和狗也是宠物,因为这些信息不包含在API响应中 .
为了解决这个问题,我可以:
-
更改API,以便超级类型信息包含在响应中
-
将猫和狗的集合映射到包含所有宠物的合并组件“prop”
-
让减速器知道猫是宠物,因此在将猫添加到商店时为宠物ID集合添加id .
使用Redux和Normalizr时,表示此类实体层次结构的最佳方法是什么?其他团队如何解决这个问题?
1 回答
这两种方法听起来都不错:
你应该尝试它们,看看哪些对你的应用更有意义 .