Question

我有点困惑为什么在类组件而不是功能中使用render。在render中，我们返回jsx语法，即使在功能上，我们也返回jsx语法。但是，为什么功能组件中没有渲染？

Answer 1

该函数本身就是render方法，除了它以props作为第一个参数而不是像在有状态组件中那样在this.props进行访问之外。

function StatelessPerson(props) {
  return <h1> {props.name} </h1>;
}

class StatefulPerson extends React.Component {
  render() {
    return <h1> {this.props.name} </h1>;
  }
}

ReactDOM.render(
  <div>
    <StatelessPerson name="Foo" />
    <StatefulPerson name="Bar" />
  </div>,
  document.getElementById("root")
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

<div id="root"></div>

为什么功能组件中没有render（）

1 个答案: