创建父子组件的两种方式

• 方式一

import React from 'react';
import ReactDOM from 'react-dom';

const Parent = (props) => {
  return <>
    i am parent
    <ChildSon />
    <ChildDaughter />
  </>;
}

const ChildSon = () => {
  return <p>i am son</p>;
}

const ChildDaughter = () => {
  return <p>i am daughter</p>;
}

const Index = () => <>
  <Parent></Parent>
</>

ReactDOM.render(<Index />, document.getElementById('root'));

• 方式二

import React from 'react';
import ReactDOM from 'react-dom';

const Parent = (props) => {
  return <>
    i am parent
    {props.children}
  </>;
}

const ChildSon = () => {
  return <p>i am son</p>;
}

const ChildDaughter = () => {
  return <p>i am daughter</p>;
}

const Index = () => <>
  <Parent>
    <ChildSon />
    <ChildDaughter />
  </Parent>
</>

ReactDOM.render(<Index />, document.getElementById('root'));