如何从不知道 Redux 的服务调度操作

How to dispatch an action from a service unaware of Redux?

本文关键字：服务 调度 操作 Redux 不知道      更新时间：2023-09-26

假设我有一个不知道 Redux 的地理位置服务，我像这样配置它：

backgroundGeoLocation.configure(
  callback // will be called with an argument when the coordinates change
);

使服务回调调度 Redux 操作而不从单独的模块导出store并使用store.dispatch()的最干净方法是什么(因为这将是单例(？

如果你想在

JavaScript中将一些值传递给某些代码，你需要使用函数。
例如

function createGeoLocationService(store) {
  let backgroundGeoLocation = new BackgroundGeoLocation()
  backgroundGeoLocation.configure(coordinates => {
    store.dispatch({ type: 'UPDATE_COORDINATES', coordinates })
  })
  return backgroundGeoLocation
}

现在，无论您在哪里创建商店，请创建该服务：

let store = createStore(reducer)
let backgroundGeoLocation = createGeoLocationService(store)

如果需要在组件中访问它，可以：

  1. 使其成为单例(是的，不是您想要的，但它是仅限客户端的应用程序的有效选项(
  2. 通过道具明确传递它(可能会很乏味，但这是最直接和明确的方式(
  3. 通过上下文隐式传递它(非常简单，但您将处理一个不稳定的 API，该 API 可能会发生变化，因此这是您的良心(

如果您不想callbackFn了解store.dispatch那么您必须创建类似 事件流 或 从callbackFn观察 .完成后，您只需将流映射到store.dispatch函数即可。

您可以自由使用任何库来创建流，但我推荐 Rx

在这种方法中，您必须提供如下内容：

var geoLocation$ = new Rx.Subject();
var newCoordinatesAction = coordinates => ({
    type: "YOUR_TUPE", 
    payload: coordinates 
});
geoLocation$.map(newCoordinatesAction).map(store.dispatch);
backgroundGeoLocation.configure(::geoLocation$.onNext);
相关文章：