React原生:HeadslessJS和Redux-如何从任务访问存储

yyhrrdl8  于 2023-02-04  发布在  React
关注(0)|答案(3)|浏览(109)

我们有一个使用redux、redux-persist和HeadlessJS任务的ReactNative应用。此任务需要访问商店。因为任务在没有启动整个应用的情况下触发(因此默认情况下没有访问权限),我们认为也可以简单地在任务内部创建存储,以便通过redux-persist对其进行再水合。以这种方式创建的商店与应用程序中的商店不同:运行后,它们包含不同的值。2我们用几种方法测试了这个问题,看起来确实是存储的问题(例如,不是操作的问题)。3我们应该如何从HeadlessJS任务访问Redux存储?
相关代码:store/configure.js

configureStore = (client) => {
  const middleware = createMiddleware(client);
  const finalCreateStore = applyMiddleware(thunk, middleware, logger)(createStore);
  const store = finalCreateStore(rootReducer, undefined, autoRehydrate());

  return store;
};

使用中(应用程序和服务中):

const client = new ApiClient();
const store = configureStore(client);
client.setStore(store);
persistStore(store, {
  storage: AsyncStorage,
}

在应用程序中,我们只是使用react-redux中的Provider来使用商店,在服务中,我们使用store.dispatch。

ghhaqwfi

ghhaqwfi1#

对于寻找解决方案的人。我已经在这里找到了解决方案。想法是将存储绑定到异步方法。
https://github.com/react-native-kit/react-native-track-player/issues/63
将解决方案复制粘贴到此处。

// index
const store = ...
....registerHeadlessTask('TrackPlayer', () => require('event-handler.js').bind(null, store));
// event-handler.js
module.exports = async (store, data) {
    if(data.type == '...') {
        store.dispatch(...);
    }
};
q7solyqu

q7solyqu2#

只需在任务内部创建存储,以便通过redux-persist对其进行再水合。
这确实发生了。
您创建了两个存储(不建议使用redux),它们都是水合的,但没有链接,因为没有链接的redux存储。每次运行createStore时,它都是一个新存储。每次调度时,您都在特定存储上执行该操作。
遗憾的是,redux不能直接解决异步或多线程问题。
不过,使用中间件和/或存储侦听器可以使两个存储保持同步。
但是redux也不是线程之间通信的手段(我假设这些任务是这样的,或者您可以在任务创建后给它一个对商店的引用,或者给主应用程序来自任务的商店引用)。
它更像是一种命令-查询-分离和集中状态的形式。

vptzau2j

vptzau2j3#

您可以直接访问您的商店作为参考。
假设你在index.js中有一个headless set,那么你可以像这样简单地使用store:

import { AppRegistry } from 'react-native';
    
    import Store from './src/Redux/Store';
    import { someAction } from './src/Redux/Actions/someActions';
        
    import App from './App';    
    import { name as appName } from './app.json';
    
    const HeadlessTask = async () => {
      console.log('Receiving HeadlessTask');
      const someParam = await Store.getState().Something.someParam;
    
      if (someParam) {
        Store.dispatch(someAction(someParam));
      } else {
        Store.dispatch(someAction());    
      }
    };
    
    AppRegistry.registerHeadlessTask('HeadlessTask', () => HeadlessTask);
    
    AppRegistry.registerComponent(appName, () => App);

相关问题