Model redux store中数据可重用计算的最佳实践_Model_Reactjs_Redux

Model redux store中数据可重用计算的最佳实践

model reactjs redux

Model redux store中数据可重用计算的最佳实践,model,reactjs,redux,Model,Reactjs,Redux,我刚刚完成了一个redux应用程序的接线，到目前为止它非常棒。然而，因为状态存储在一个巨大的存储中，所以您没有任何模型可以访问数据假设我有一个模型类，它存储关于用户的一些信息。我通常会在类中添加一个名为display\u name的函数，该函数智能地组合了名称的不同部分。这样，我的不同视图就可以简单地调用display\u name，而不需要自己知道如何计算 Redux明确表示不在状态中存储计算值，这样就可以在组件中定义计算值。但这不可能是正确的，因为这样一来，您将在每个需要它的组件中复制此代

我刚刚完成了一个redux应用程序的接线，到目前为止它非常棒。然而，因为状态存储在一个巨大的存储中，所以您没有任何模型可以访问数据

假设我有一个模型类，它存储关于用户的一些信息。我通常会在类中添加一个名为

display\u name

的函数，该函数智能地组合了名称的不同部分。这样，我的不同视图就可以简单地调用

display\u name

，而不需要自己知道如何计算

Redux明确表示不在状态中存储计算值，这样就可以在组件中定义计算值。但这不可能是正确的，因为这样一来，您将在每个需要它的组件中复制此代码

存储此逻辑的正确位置在哪里？

最简单的方法是创建实用程序函数来计算此数据，并将它们放在一个单独的模块中，该模块可由许多组件的

MapStateTrops

函数使用。一个超级简单的例子：

从“/utils”导入{displayName}；
函数MapStateTops（状态）{
返回{
displayName:displayName（state.user）
};
}
功能MyComponent（道具）{
返回名称：{props.displayName}；
}
导出默认连接（MapStateTrops）（MyComponent）；

根据Redux文档中的页面，建议的方法是使用库来处理选择和备忘

如果您在Github中搜索包含术语“createSelector”的Javascript项目，您应该会找到许多以各种方式使用重新选择的实际应用程序。这是我发现的三个：，和