从页面 JS 中访问 React 对象？答案

【问题标题】：Access React Object from within page JS?从页面 JS 中访问 React 对象？
【发布时间】：2017-12-05 14:37:52
【问题描述】：

我有一个 ReactVr 对象，我正在使用下面的代码进行渲染。初始化 React 后，我会定期接收服务器更新，我想将这些更新作为道具传递给 React，我该怎么做？可以从我的“普通”JS 中设置 React 对象中的道具吗？

ReactVR.init(
    './build/index.bundle.js',
    document.body,
    // third argument is a map of initialization options
    {
      initialProps: {
        source: 'world.json',
         userType: "typ1"
        },
      cursorVisibility: 'visible'
    }
  );

编辑：服务器更新是通过 Websockets 连接进行的，但是从 React 内部没有收到消息，仅在“正常”JS 中。

在“普通”JS 中，这会从服务器返回数据，如果我在 React 中使用相同的数据，则连接会打开，但永远不会收到消息。然而，消息可以从 React 内部发送。

socket.addEventListener('message', function (event) {

        console.log('Message from server ', event.data);

  });

【问题讨论】：

您如何接收服务器更新？另外，要回答您的问题，是的，您可以从“正常” js 设置反应道具，因为反应是正常的 js。
它们是通过 websockets 连接来的，但是从 React 内部没有收到消息，只有在“正常”JS 中
您能否发布更多代码来展示您已经尝试过的内容？
@T Porter 添加了
根据您设置连接的位置，当 React 组件重新渲染时，它可能会丢失。 This article 似乎很好地解释了该过程的客户端和服务器端。还有一个react-websocket 库可能对您有用。

标签： javascript reactjs react-360

【解决方案1】：

您应该能够创建一个本机模块来促进此功能。

在此处查看相关文档：https://facebook.github.io/react-vr/docs/native-modules.html

创建模块并将其链接到 client.js 后，您可以将其导入组件并将其用作 react vr 和套接字实现之间的通信层。

为此，请在 client.js 中的 init 函数中添加

const socketsModule = new SocketsModule();

然后您可以在新导入或该文件本身中添加：

export class SocketsModule extends Module {
  constructor() {
    super('SocketsModule');
  }

  init() {
  }

  customMethod() {
    // Do fun stuff here
  }

}

然后在你想要调用这些方法的 react VR 组件中，你首先包含这个新模块：

const SocketsModule= NativeModules.SocketsModule;

然后您可以从该组件中访问其方法：

SocketsModule.customMethod();

【讨论】：

哪里有这样的例子？
用更完整的例子更新了我的答案，希望对您有所帮助！
这太棒了，谢谢！还有一件事，我如何将事件从 SocketsModule 传递回 Index.vr.js ？
你可能会在这个例子中找到一些正义：github.com/facebook/react-vr/tree/master/Examples/… 不知道该怎么做