将React组件与HTML块混合使用

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元素的集合。

我遵循的一条经验法则是：当您认为新的责任有序时，创建一个新组件。

Answer 2

div 是一个与其他组件一样的组件，除了它是＆＃34;原语＆＃34;一。将HTML中的原始组件与您自己的自定义组件混合应该没有问题。