javascript - 从 vanilla JS 使用 JSX 时是否可以调用 ReactDOM.render() ？

Question

目前我正在学习 ReactJS。据我了解，用 JSX 编写的代码与 vanilla JS 没有不同的可见性范围。但是，如果我想在 vanilla JS 上做一些东西，然后才调用 ReactDOM.render() 但仍然想将 JSX 与 React 一起使用，这是否可能，如果是的话 - 如何实现？

Answer 1

class RootComponent extends React.Component {
   render() {
        return (
          <div >
            Hello, World.
          </div>
        )
    }
}

ReactDOM.render(
    React.createElement(RootComponent), 
    document.getElementById('root')
);

请注意，渲染调用没有 JSX。这意味着您可以将它从主 javascript 文件中分离出来，并在任何上下文中调用它，例如作为 <script> 标记中的内联 javascript:

主要.js:

class RootComponent extends React.Component {
   render() {
        return (
          <div >
            Hello, World.
          </div>
        )
    }
}

index.html:

<script>
    ReactDOM.render(
        React.createElement(RootComponent), 
        document.getElementById('root')
    );
</script>