我正在学习React。我把他们添加到我的网站与html脚本标签：
我的索引
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MyWebsitewithReact</title>
<link rel="stylesheet" href="css/main.css">
<meta name="theme-color" content="#2e2e2e">
</head>
<body>
<div class="navbar">
<a href="#">Home</a>
<a href="developer/">Plugins</a>
</div>
<div id="root"></div>
<script src="https://unpkg.com/react@18/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@18/umd/react-dom.development.js" crossorigin></script>
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<script src="js/index.js"></script>
</body>
</html>我的索引. js
'use strict';
function LikeButton() {
const [liked, setLiked] = React.useState(false);
if (liked) {
return 'You liked this!';
}
return React.createElement(
'button',
{
onClick: () => setLiked(true),
},
'Like'
);
}
const rootNode = document.getElementById('root');
const root = ReactDOM.createRoot(rootNode);
root.render(React.createElement(LikeButton));错误：Error: Minified React error #299; visit https://reactjs.org/docs/error-decoder.html?invariant=299 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
我试图访问，错误是：createRoot(...): Target container is not a DOM element.
我检查了文档，一切似乎正常
编辑：
1条答案
按热度按时间yqkkidmi1#
首先在您的文件index.js中，您需要在第一行添加：
因为如果没有导入这些库，您将无法使用React和ReactDOOM的元素。
在你的index.html中你需要替换它
改为：
我希望我解决了你的问题。