繁体   English   中英

如何在Redux中设计用户状态

[英]How to design the users state in Redux

如果您使用Redux并拥有Instagram之类的产品(订阅,订户和用户状态的当前用户),最好仅使用用户作为实体来设计状态而没有任何分隔(例如用户数据库表),或者您将状态形状分为多个块,例如订阅部分,订阅者部分和current_user部分?

提前非常感谢您!

- - - - - - - - - - - - - - - - - - - - 编辑 - - - - - ----------------------

https://i.stack.imgur.com/1zK1T.jpg

感谢您的答复! 我有图中所示的状态。 事实是,当您必须更新状态时这很棒,但是存在性能问题,因为当我们要获取划分的状态并具有订阅,订阅者和current_user时,当我们要检索订阅或订阅者时我们必须执行循环部件,因为不再需要任何循环,因此不再存在性能问题。但是,当我们要执行某些类型的更新时,我们将遇到一些问题,例如,当订户不关注该用户时该怎么办? 我们将尝试找出一种解决方案,以使商店能够更新订户列表。 但是,这是一项艰巨的任务,因为对于拥有数百万关注者的人来说,这就像在长期投票的技术中跟踪所有关注者。顺便说一句,我没有使用Redux,而是使用了自己的Flux变体和商店的Redux样式状态。

--------------------------编辑2 ----------------------- ---

多谢你们。 我终于做到了: https ://imgur.com/a/v4iGO我现在也有订户和other_users商店。

没有正确的答案。 但是,您可以像下面这样。

{
subscriptions:{/*....*/} ,
subscribers:{/*....*/} ,
currentUser{/*....*/} ,
}

要记住的主要事情是保持Redux状态规范化,您可以使用normalizr这样的库。 由于处于Redux状态的对象数组设计不佳,因此应使其尽可能平坦。
阅读此聊天记录以获取更多说明//groups.google.com/forum/#!topic/reactjs/jbh50-GJxpg

示例:如果您的订户是对象数组

{subscribers :[{id:subscriberId1, ....}, {id:subscriberId2, ....}]}

将此转换为如下所示。

subscribers :{
subscriberEntities:{
subscriberId1:{id:subscriberID1, ....}, 
subscriberId2:{id:subscriberId2, ....}
}
subscriberEntitiesOrder:[subscriberId1,subscriberId2]

因此,在这里,如果您有ID,则可以直接从subscriberEntities[id]获取它的对象,它的索引也为subscriberEntitiesOrder.indexOf(id)而不必每次都循环。 :)

如Redux文档中所述,此方法的主要优点是:

当某条数据在多个位置重复时,将很难确保对其进行适当的更新。

嵌套数据意味着相应的化简器逻辑必须更嵌套,因此更加复杂。 尤其是,尝试更新深度嵌套的字段可能很快变得非常丑陋。

由于不可变的数据更新也需要复制和更新状态树中的所有祖先,并且新的对象引用将导致重新呈现连接的UI组件,因此对深度嵌套的数据对象的更新可能会迫使完全不相关的UI组件重新进行渲染。即使它们显示的数据实际上没有发生变化,也可以渲染。

因此,在Redux存储中管理关系数据或嵌套数据的推荐方法是将存储的一部分视为数据库,并将其以规范化形式保存。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM