如何将有状态数组从子组件传递到父组件？React Hooks

import React, { useState } from 'react';

function ParentComponent() {
  const [stateArray, setStateArray] = useState([]);

  // 定义一个回调函数，用于接收子组件传递的状态数组
  const handleStateArray = (array) => {
    setStateArray(array);
  };

  return (
    <div>
      <ChildComponent onStateArrayChange={handleStateArray} />
      {/* 在父组件中使用状态数组 */}
      {stateArray.map((item, index) => (
        <p key={index}>{item}</p>
      ))}
    </div>
  );
}

import React, { useState } from 'react';

function ChildComponent(props) {
  const [stateArray, setStateArray] = useState([]);

  // 在子组件中更新状态数组，并调用父组件的回调函数传递给父组件
  const updateStateArray = () => {
    const newArray = ['item1', 'item2', 'item3'];
    setStateArray(newArray);
    props.onStateArrayChange(newArray);
  };

  return (
    <div>
      <button onClick={updateStateArray}>Update State Array</button>
    </div>
  );
}