设置React本机子组件

import React from 'react';

class ChildComponent extends React.Component {
  render() {
    return (
      // 子组件的UI和逻辑
      <div>
        <h2>子组件</h2>
        {/* 子组件的内容 */}
      </div>
    );
  }
}

export default ChildComponent;

import React from 'react';
import ChildComponent from './ChildComponent';

class ParentComponent extends React.Component {
  render() {
    return (
      // 父组件的UI和逻辑
      <div>
        <h1>父组件</h1>
        {/* 渲染子组件 */}
        <ChildComponent />
      </div>
    );
  }
}

export default ParentComponent;

import React from 'react';

class ChildComponent extends React.Component {
  render() {
    // 接收父组件传递的数据和方法
    const { data, handleClick } = this.props;

    return (
      // 子组件的UI和逻辑
      <div>
        <h2>子组件</h2>
        <p>{data}</p>
        <button onClick={handleClick}>点击按钮</button>
      </div>
    );
  }
}

export default ChildComponent;