React更改父数组属性

// 父组件
import React, { useState } from 'react';
import ChildComponent from './ChildComponent';

function ParentComponent() {
  const [array, setArray] = useState([1, 2, 3]);

  const handleArrayChange = (newArray) => {
    setArray(newArray);
  };

  return (
    <div>
      <ChildComponent array={array} onArrayChange={handleArrayChange} />
    </div>
  );
}

export default ParentComponent;

// 子组件
import React from 'react';

function ChildComponent({ array, onArrayChange }) {
  const handleClick = () => {
    const newArray = [...array]; // 创建一个新的数组副本
    newArray[0] = 10; // 修改数组属性
    onArrayChange(newArray); // 将修改后的数组传递给父组件
  };

  return (
    <div>
      <button onClick={handleClick}>修改数组属性</button>
    </div>
  );
}

export default ChildComponent;