REACTION是一个新组件，无法获取ReactDOM来呈现javascript组件
我正在从Udemy学习react（react-完整指南（包括挂钩、react路由器、Redux）由Maximilian Schwarzmüller撰写。在课程内容4.编写我们的第一个react代码时，Max使用codepen.io导入react和reactdom cdn链接和babel预处理器。我没有使用codepen.io。我通过元素标记之前的script标记导入react和reactdom以及babel预处理器。但是，我得到了一个未捕获的语法和未捕获的参考错误。我的代码如下所示：-
超文本标记语言代码如下
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="./main.css">
</head>
<body>
<div id="p1"></div>
<div class="person">
<h1>Akshar</h1>
<p>Your Age: 27</p>
</div>
<script src="./app.js"></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/react/16.9.0/cjs/react.development.js">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.9.0/cjs/react-dom-
server.browser.development.js"></script>
<script type="text/babel" src="https://cdnjs.cloudflare.com/ajax/libs/babel-
standalone/6.26.0/babel.js"></script>
</body>
</html>
CSS代码如下：-
.person {
display: inline-block;
margin: 10px;
border: 1px solid #eee;
box-shadow: 0 2px 2px #ccc;
width: 200px;
padding: 20px;
}
应用程序。js代码如下：-
import React from 'react';
import ReactDOM from 'react-dom';
function Person() {
return (
<div class="person">
<h1>Max</h1>
<p>Your Age: 28</p>
</div>
);
}
ReactDOM.render(<Person/>, document.querySelector('#p1'));
共有1个答案
这里有几件事：
- 脚本的顺序很重要。浏览器会按创建脚本的顺序停止加载和处理脚本。
也请检查此链接。
-
我正在使用React构建一个web应用程序，它将在用户每次单击按钮时显示不同的报价。我一直在寻找一种方法，让组件在单击按钮时重新呈现/刷新，我尝试了本文中介绍的所有可能性，但都没有成功。 即使创建运行或的单独函数，并使用调用该函数，也不起作用；我想我一定是执行错了什么。有没有人知道我的错误在哪里？
-
我是新来的反应。作为一个学习练习，我正在构建一个国际象棋应用程序 我想根据父级中的状态更改子级的DOM。当前，在父级组件的状态变化时，子级组件没有变化。 PS：请忽略任何语法错误。这段代码是实际代码的精简。如果你想看完整的代码，请看这里
-
我是这个世界的新手，并试图进入这个世界。我正在编写一个样式指南，需要显示一些HTML代码作为示例。我使用的是ReactPrism，我无法在PrismCode组件中获得HTML输出，我已经找到了一个解决方法，使用ReactToJSX来显示jsx代码而不是HTML。代码如下： 因此，基本上我希望将this.props.children（组件）呈现为HTML代码，而不是PrismCode中的内容，我甚至
-
我从这里修改了以下组件定义，如下所示。但是，与示例不同的是，每次在组件上移动鼠标时，组件都会重新呈现。 重新渲染非常引人注目： 有人知道为什么会这样吗？
-
问题内容： 我是新来的世界，我有这样的话： 然后单击，您将被打印在控制台上。现在将行更改为： 现在点击该按钮，我希望它会被渲染。但事实并非如此。 我不确定为什么会这样。请注意，我在方法中有上面的代码。 问题答案： 您可能希望有一个状态组件，该状态组件在单击按钮之后在按钮旁边显示另一个组件。您需要做的就是跟踪按钮是否被单击：
-
我创建了一个登陆页面,当用户滚动这个站点时,我使用scrollTrigger（gsap）来显示元素.但我看到我的网站有时崩溃，工作非常慢。此外，当用户滚动到该节和布局时，节呈现的所有时间之一将崩溃。我认识到这个问题的想法很简单。在我的包装中，我有一段代码，如下所示： 大概是这样的 请看我将console.log使用到return（）中。此控制台在访问我的网站期间一直显示。所有的时间，如果用户滚动网