是否可以从本机模块调用react-360方法？

Question

我在一个虚拟现实项目中工作，它有2个用户角色，一个领导者(谁设置和配置一个虚拟现实会议)和客户(谁连接到这个会议)。我正在使用一个Native模块来执行一个DOM覆盖，其中为leader显示了几个与会话配置相关的按钮。我想知道是否有可能在React360代码中直接从本机模块调用函数(即不是作为回调，因为事件将源自本机模块)？这可能是一个完全的反模式，我似乎看不到这样做的方法……

Answer 1

实际上，我用下面的代码实现了这个功能：

在client.js中，我将上下文传递给DOM overlay本机模块：

  const r360 = new ReactInstance(bundle, parent, {
    // Add custom options here
    fullScreen: true,
    cursorVisibility: "visible",
    nativeModules: [
      // Create an instance of the DOM overlay module and pass the context
      ctx => new DashboardModule(ctx, domDashboardContainer)
    ],
    ...options,
  });

在仪表板本机模块中：

const eventToOb = (event) => {
    const eventOb = {};
    for (let key in event) {
        const val = event[key];
        if (!(lodash.isFunction(val) || lodash.isObject(val))) {
            eventOb[key] = val;
        }
    }
    return eventOb;
};

....

    constructor(ctx, overlayContainer) {
        super('DashboardModule');     
...
        this._rnctx = ctx;

        this._bridgeName = 'BrowserBridge';
    }

   onButtonClick() {
       ....
       this._emit('nativeButtonClicked', event);
   }

    _emit(name, event) {
        if (!this._rnctx) {
            return;
        }
        const eventOb = eventToOb(event);
        this._rnctx.callFunction(this._bridgeName, 'notifyEvent', [name, eventOb]);
    }

...

在我的index.js中

...
import BatchedBridge from 'react-native/Libraries/BatchedBridge/BatchedBridge';
import lodash from 'lodash';

class BrowserBridge {
  constructor() {
      this._subscribers = {};
  }

  subscribe(handler) {
      const key = String(Math.random());
      this._subscribers[key] = handler;
      return () => {
          delete this._subscribers[key];
      };
  }

  notifyEvent(name, event) {
      lodash.forEach(this._subscribers, handler => {
          handler(name, event);
      });
  }
}

const browserBridge = new BrowserBridge();
BatchedBridge.registerCallableModule(BrowserBridge.name, browserBridge);

....

  constructor(props) {
    super(props);
    this.onBrowserEvent = this.onBrowserEvent.bind(this);
    ...
  }

  componentWillMount() {
    this.unsubscribe = browserBridge.subscribe(this.onBrowserEvent);
  }

  onBrowserEvent(name, event) {
      // Do action on event here
  }

  componentWillUnmount() {
      if (this.unsubscribe) {
          this.unsubscribe();
          delete this.unsubscribe;
      }
  }

如果有更好的方法，请让我知道。