如何在react中保存多个复选框值

import React, { useState } from 'react';

function App() {
  const [checkboxValues, setCheckboxValues] = useState([]);

  // 其他组件代码

  return (
    // JSX代码
  );
}

export default App;

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

  if (isChecked) {
    setCheckboxValues([...checkboxValues, value]);
  } else {
    setCheckboxValues(checkboxValues.filter(item => item !== value));
  }
}

// 在JSX中渲染复选框
<input type="checkbox" value="value1" onChange={handleCheckboxChange} />
<input type="checkbox" value="value2" onChange={handleCheckboxChange} />
<input type="checkbox" value="value3" onChange={handleCheckboxChange} />

// 例如，可以在提交表单时使用选中的复选框值
function handleSubmit(event) {
  event.preventDefault();
  console.log(checkboxValues);
  // 其他处理逻辑
}