如何从泛型 javascript 引用 React class

Question

我有这个 index.html :

<html>
<head>
  <title>Sample App</title>
  <link href="./src/css/bootstrap.min.css" rel="stylesheet" />
  <link href="./src/css/bootstrap.dashboard.css" rel="stylesheet">
</head>
<body>
  <div id='root'>
  </div>
  <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
  <script type="text/javascript" src="./src/js/jquery.signalR-2.2.0.min.js"></script>
  <script src="http://localhost:26665/signalr/hubs"></script>
  <script type="text/javascript" src="/static/bundle.js"></script>


  <script type="text/javascript">
    $(function() {
        var myHub = $.connection.signalRTwitchBotParserHub;

        myHub.client.OnNewMessage = function (data) {
              // Call AppActions.dispatchMessage(message);
        };

        $.connection.hub.url = "http://localhost:26665/signalr";
        $.connection.hub.start()
   });
  </script>
</body>

如何从那里调用 React 创建的 class？我想替换 // Call AppActions.dispatchMessage(message);

Answer 1

您可以通过添加

将 React 添加到页面中

<script src="https://fb.me/react-0.13.3.min.js"></script>

请参阅 full list of downloads 了解其他可包含的选项（例如 JSX Transformer）。

Answer 2

您可以执行如下操作。它所做的是创建一个 YourReactClass 的实例，它将自己呈现为您的 div 的子节点，ID 为 root。它还将 message 作为属性传递给反应实例，以便它可以使用该数据。请注意，我添加了 key="rootclass" 以确保每次调用此代码时，React 继续重用由 react class 创建的 DOM 节点，而不是删除旧节点并添加新节点。

React.render((<YourReactClass key="rootclass" message={message} />), document.getElementById('root'));

如何从泛型 javascript 引用 React class

How to reference a React class from generic javascript

javascript

flux

node.js

reactjs