React 中的实例？

【问题标题】：instance in React?React 中的实例？
【发布时间】：2020-08-13 04:40:02
【问题描述】：

class OMG extends React.Component {
  render() {
    return <h1>Whooaa!</h1>;
  }
}

class Crazy extends React.Component {
  render() {
    return <OMG />;
  }
}

在代码中，疯狂类的渲染方法现在返回 OMG，返回的 OMG 是什么？

是上层阶级吗？
还是 OMG 类的实例？
如果它是 OMG 类的实例，为什么它与 OMG 类的名称相同？好糊涂????????????

【问题讨论】：

这里只是组件之间的父子关系。 OMG 还给你<h1>Whooaa!</h1>

标签： javascript reactjs class object

【解决方案1】：

没有“上流社会”

这只是一个调用另一个组件的组件（作为调用另一个函数的函数）
您可以将该代码与类似的代码进行比较

function OMG() {
  console.log('Whooaa!');
}

function Crazy(){
  OMG()
}

此外，您返回的组件结构可能不止一个组件，谈论“上层”毫无意义

class MyBigTitle extends React.Component {
  render() {
    return <h1>Welcome on my website!</h1>;
  }
}

class MyHomePage extends React.Component {
  render() {
    return (
      <div>
        <MyBigTitle/>
        <MyBeautifulForm/>
      </div>
    );
  }
}

【讨论】：