Question

以下是我的React.Component的render方法：

class Layout extends React.Component {
    constructor() {
        super();
        this.state = {name: "Brian"};
    }

    changeName(name) {
        this.setState({name});
    }

    render() {
        return (
            <h1 class="row">hello</h1>
        );
    }
}

ReactDOM.render(
  <Layout/>,
  document.getElementById('app')
);

这是呈现的HTML：

<div id="app" class="container">
    <h1 data-reactroot="">hello</h1>
</div>

我不明白，为什么class的{{1}}属性消失了？

Answer 1

React元素没有class属性。您必须使用className属性。

这里的原因在React的文档中提供：
https://facebook.github.io/react/docs/jsx-in-depth.html#html-tags-vs.-react-components

Answer 2

您需要使用className代替class

<h1 className="row">hello</h1>

为什么class属性会从＆＃34; h1＆＃34; React渲染的元素？

2 个答案: