我是 React 世界的新手，在查看教程并编写了一些代码后，我想知道是否可以将 value 和颜色等属性添加到 div。我的意思是，我如何返回带有颜色的 Hello World。下面是一个例子：
<div style="color: red;">Hello World!</div>我尝试使用构造函数，但我无法渲染颜色和“Hello World！
回答1
在 JSX 文件中，您将使用 <div style={{color: 'red'}}>Hello World!</div>
回答2
我会为此使用一个类。
function Example() {
return (
<div className="red">
Hello world!
</div>
);
}
ReactDOM.render(
<Example />,
document.getElementById('react')
);.red { color: red; }<script src="https://cdnjs.cloudflare.com/ajax/libs/react/17.0.2/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/17.0.2/umd/react-dom.production.min.js"></script>
<div id="react"></div>或者，如果您将 props 传递给另一个组件，您仍然可以使用此方法。只需将颜色作为 prop 传递，然后使用 className={color}。
function Example() {
return <Hello color="red" />
}
function Hello({ color }) {
return (
<div className={color}>
Hello world!
</div>
);
}
ReactDOM.render(
<Example />,
document.getElementById('react')
);.red { color: red; }<script src="https://cdnjs.cloudflare.com/ajax/libs/react/17.0.2/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/17.0.2/umd/react-dom.production.min.js"></script>
<div id="react"></div>