从页面 JS 中访问 React 对象?

IT技术 javascript reactjs react-360
2021-05-23 16:23:02

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

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);

  });
1个回答

您应该能够创建本机module来促进此功能。

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

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

为此,在您的init函数中client.js添加

const socketsModule = new SocketsModule();

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

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

  init() {
  }

  customMethod() {
    // Do fun stuff here
  }

}

然后在您的 React VR 组件中,您希望调用这些方法,您首先要包含这个新module:

const SocketsModule= NativeModules.SocketsModule;

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

SocketsModule.customMethod();