存储复杂的API对象并允许从组件和redux

时间:2018-01-24 20:04:24

标签: reactjs react-native redux react-redux

我试图寻找"良好做法"关于如何链接需要配置或由一些经理提供的复杂API,我似乎无法找到如何制作好的"数据流通过redux。

到目前为止,我一直在考虑使用动作来创建一个reducer,该动作映射我可以在给定复杂对象上调用的每个方法。

为了给它添加更多上下文,我正在构建一个框架,使用这个库(https://github.com/Polidea/react-native-ble-plx)与蓝牙设备进行交互,startScanDevice返回我可以与之交互的复杂对象(https://polidea.github.io/react-native-ble-plx/#device)也拥有它自己的状态(例如,设备知道它是否已连接,它还知道它的蓝牙服务等)。

根据我的阅读,redux状态应该是简单的对象,因此它可以具有时间旅行属性并且易于持久化。

存储这些复杂对象并在我的组件,缩减器,操作,商店以及我目前正在使用的API之间实现交互的优秀设计是什么?

目前,我正在考虑为我的API提供回调,该回调将使用新数据发送redux操作以添加到redux存储中,但我似乎无法找到存储复杂对象并提供访问权限的正确方法为了调用这些方法并给它们回调。

这是一个完整的流程示例:

  • 从plx-ble API调用startScanDevice并提供回调以接收现有API提供的设备对象
  • 接收设备对象并将其存储在某处
  • 使用有关我在整个应用中需要的设备对象的正确信息更新redux商店
  • 从reducer中,从步骤2中检索设备对象并调用与设备交互的方法(示例从特征中读取)
  • 使用步骤4中的读取数据更新redux商店

步骤2和4是我似乎无法找到合适的方法。

非常感谢任何帮助!

2 个答案:

答案 0 :(得分:0)

Redux-thunk中间件对您有所帮助。

  

Redux Thunk中间件允许您编写返回的动作创建者   一个函数而不是一个动作。 thunk可以用来延迟   发送行动,或仅在某种情况下发送   满足。内部函数接收存储方法dispatch和   getState作为参数。

存储这些复杂的对象

请勿使此复杂化。尽量保持您的状态尽可能平坦。 像

state={
  PoweredOn: false,
  Device: "deviceName",
  //similarly all
}

保持平衡越多,修改起来就越容易。

答案 1 :(得分:0)

您链接的API文档似乎有重复的方法来调用这些方法。

例如,您可以通过调用device.connect(options)或调用包方法connectToDevice(deviceId, options)来连接到设备。第二种方法的好处是您只需跟踪ID值,而无需存储整个设备对象。