在头部部分，我添加了需要完成的 CDN 链接。<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 回答
尚方宝剑之说
TA贡献1788条经验 获得超4个赞
您的代码中有几个拼写错误：
React.component应该React.ComponentReactDomFactories是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>
添加回答
举报
0/150
提交
取消