Question

我是Redux的新手，并且提出了一种看来错误的架构。我希望有人可以向我解释构建我的应用程序的更好方法。

简而言之，我想遵循使redux存储尽可能保持平坦的想法，但是最终我得到了一个存储对象的大型存储对象。我只有1个减速器和1个动作。这一切对我来说似乎都是错误的。但是，那时我的应用程序非常有限。

背景信息 我正在设计一个可通过蓝牙与医疗设备通信的应用程序。对于给定的屏幕，在渲染之前，我需要获取感兴趣的数据项。设备上的数据项集是固定的，并且事先已知。该应用仅仅是显示它们并可能对其进行更新的工具。

示例 “信息屏幕”显示有关设备当前状态的信息。为了简单起见，假设屏幕将仅在列中显示一些项目。这些是

音量
费率
间隔
isIntervalEnabled

我将需要一次针对每个数据项向设备发送提取命令。然后，设备应（在某个时候）发送一个响应，其中包含每个相关项目的数据。响应应该更新商店，以便在将mapStateToProps传递给连接时这些项目可用。

商店的当前体系结构以及我如何从商店中检索商品 在这一点上，我觉得我的redux存储只是一个大数据库。由于我事先知道设备需要的所有数据项，因此我决定仅使用所有这些数据项初始化状态。

{
  volume: {amount: 30, units: ML},
  rate: {amount: 30, units: ML},
  interval: {amount: 20: units ML_PER_HOUR},
  isIntervalEnabled: true
}

请注意，在此示例中，这些只是伪值，实际上，键的值将是undefined，并且只有设备的响应和对存储的更新才可以为某项赋值 < / p>

我在一个单独的文件中为每个项目创建了选择器，看起来像这样。

const volume = (state) => state.volume;
const volumeSelector = createSelector([volume], (volumeObject) => volumeObject);

每个项目都具有这种类型的结构。请注意，createSelector来自重新选择库。

在“设备信息”屏幕的底部，我具有像这样的mapStateToProps函数

function mapStateToProps(state){
  return {
           volume: volumeSelector(state),
           rate: rateSelector(state)
           interval: intervalSelector(state)
           isIntervalEnabled: intervalSelector(state)
         }
}

（实际上，我喜欢从设备中获得30件物品）并且某些屏幕不仅会希望从设备获取信息，而且还会将信息发送到设备。为此，我写了一个这样的动作

actionUpdate(deviceItemId, propsToUpdate){
  return {type: "Update", deviceItemId, propsToUpdate}
}

还有这样的减速器

updateRecuder(state, action){
    const theProps = action.propsToUpdate
    const theId = action.deviceItemId,
    const updatedItem = <merge state[theId] with theProps>
    return state merged with updatedItem
}

这意味着我有大约30个设备项1减速器1动作，这似乎与我在其他redux项目中看到的其他动作完全不同。从某种意义上讲，我似乎只是在像数据库一样使用redux。我想知道

我在做一个坏主意吗，为什么？
如何重新构建该对象，以便遵循标准的redux模式

Answer 1

Redux非常灵活，可以让您做很多事情，例如拥有2家商店。据我了解，您正确地完成了所有操作。如果使代码更具可读性，不要害怕做更多的简化操作。

https://redux.js.org/basics/dataflow

只要您遵循数据流，就可以了：）

设计redux存储：什么是标准设计实践

1 个答案: