如何在不使用Redux的情况下将状态从多个子组件获取到父组件以进行处理

import React, { useState } from 'react';

const ParentComponent = () => {
  const [state, setState] = useState('');

  const handleStateChange = (newState) => {
    setState(newState);
  };

  return (
    <div>
      <ChildComponent1 onStateChange={handleStateChange} />
      <ChildComponent2 onStateChange={handleStateChange} />
      <ChildComponent3 onStateChange={handleStateChange} />
      {/* 其他子组件 */}
    </div>
  );
};

export default ParentComponent;

import React from 'react';

const ChildComponent1 = ({ onStateChange }) => {
  const handleClick = () => {
    // 子组件中处理状态的逻辑
    const newState = 'New State';
    onStateChange(newState);
  };

  return <button onClick={handleClick}>Update State</button>;
};

export default ChildComponent1;