import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
ReactDOM.render(
React.createElement("h1", { style: { color: "red" } }, "Hello123!"),
document.getElementById("root")
);
// => Rendering multiple React elements
ReactDOM.render(
React.createElement(
"div",
{ style: { color: "blue" } },
React.createElement("h1", null, "abc") // Rendering multiple React elements
),
document.getElementById("root")
);
gets a little unwieldy笨拙, 反义词wieldy
Now, as our applications become more complex, writing all of these react.create element calls gets a little unwieldy.
现在,随着我们的应用程序变得越来越复杂,编写所有这些 react.create 元素调用变得有点笨拙。
ReactDOM.render(
<ul>
<li>123</li>
<li>123</li>
</ul>,
document.getElementById("root")
);
Bable
Now, our browser isn’t just going to render tags automatically in the browser, but because we’re using create React app there’s a tool that’s working behind the scenes called Babel.
现在,我们的浏览器不仅会在浏览器中自动渲染标签,而且因为我们使用的是 create React 应用程序,所以有一个名为 Babel 的工具在幕后工作。
get rid of this comment 去掉这个评论
vital 重要
wieldy 灵活的
behind the scenes 在幕后
A solid understanding of JSX syntax is important for getting the most out of React.
充分理解 JSX 语法对于充分利用 React 非常重要。
getting the most out of 充分利用