如何在REACT中存储表中所有已检查数据的新数组？

const checkedDataArray = [];

<input type="checkbox" onChange={handleCheckboxChange} />

const handleCheckboxChange = (event) => {
  const isChecked = event.target.checked;
  const dataItem = event.target.value;

  if (isChecked) {
    checkedDataArray.push(dataItem);
  }
};

const [checkedData, setCheckedData] = useState([]);

const handleCheckboxChange = (event) => {
  const isChecked = event.target.checked;
  const dataItem = event.target.value;

  if (isChecked) {
    setCheckedData((prevCheckedData) => [...prevCheckedData, dataItem]);
  }
};

{checkedData.map((dataItem) => (
  <div key={dataItem}>{dataItem}</div>
))}