Question

在头部，我添加了需要完成的CDN链接。

a.upper()

在正文部分，我提到了编写反应代码的元素，请检查体内的元素可以正常工作，但react组件无法渲染。

<head>
    <meta charset="UTF-8">
    <title>First Component</title>
    <script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
    <script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
    <script crossorigin src="https://unpkg.com/react-dom-factories@1.0.0/index.js"></script>
</head>

在上面的代码元素中显示良好，但react-dom未呈现。

Answer 1

您的代码中有几次错别字：

React.component应该是React.Component
ReactDomFactories是ReactDOMFactories（您在h2中正确找到了：））
ReactDom.render实际上是ReactDOM.render

<head>
  <meta charset="UTF-8">
  <title>First Component</title>
  <script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
  <script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
  <script crossorigin src="https://unpkg.com/react-dom-factories@1.0.0/index.js"></script>
</head>

<body>
  <div id="app"></div>
  <h1>Hello</h1>
  <script type="text/javascript">
    class Pet extends React.Component{
      render (){
          const h2 = ReactDOMFactories.h2(null, "Potter");
          const img = ReactDOMFactories.img({src:"https://upload.wikimedia.org/wikipedia/commons/thumb/6/6e/Indian_spitz_adult.JPG/640px-Indian_spitz_adult.JPG",
          alt:"Potter my dog"});
          return ReactDOMFactories.div(null, h2,img);
      }
    }
   ReactDOM.render(React.createElement(Pet),document.getElementById("app"));
  </script> 
</body>

React-DOM没有呈现网页中的元素

1 个答案: