javascript - 将 React 组件与 HTML block 混合

Question

让我一直感到困惑的是有多少 React 示例将所有内容都显示为组件。但是假设我只需要在我的组件旁边包含一些简单的 HTML，例如:

class Homepage extends Component {
  render() {
    return (
      <Container>
        <Hero />
        <Features />
        <div className="copyright">Copyright Some Company Name.</div>
      </Container>
    );
  }
}

div元素永远不会超过静态文本。

应该 <div>被移动到一个纯组件？或者可以通过添加纯 HTML 来简化主页组件吗？

Answer 1

当然没问题。总而言之，它最终是 HTML。当你调用 render 函数时，React 组件是一组 html 元素。

我遵循的一个经验法则是:当您认为需要承担新职责时，创建一个新组件。