选中另一个react native时自动取消选中复选框

import React, { useState } from 'react';

const Checkbox = () => {
  const [isChecked, setIsChecked] = useState(false);

  const handleCheckboxChange = () => {
    setIsChecked(!isChecked);
  };

  return (
    <input type="checkbox" checked={isChecked} onChange={handleCheckboxChange} />
  );
};

import React, { useState } from 'react';

const ParentComponent = () => {
  const [selectedCheckboxIndex, setSelectedCheckboxIndex] = useState(null);

  const handleCheckboxChange = (index) => {
    setSelectedCheckboxIndex(index);
  };

  return (
    <div>
      <Checkbox index={0} onChange={handleCheckboxChange} isSelected={selectedCheckboxIndex === 0} />
      <Checkbox index={1} onChange={handleCheckboxChange} isSelected={selectedCheckboxIndex === 1} />
      {/* 其他复选框组件 */}
    </div>
  );
};

import React from 'react';

const Checkbox = ({ index, onChange, isSelected }) => {
  const handleCheckboxChange = () => {
    onChange(index);
  };

  return (
    <input type="checkbox" checked={isSelected} onChange={handleCheckboxChange} />
  );
};

const handleCheckboxChange = (index) => {
  if (selectedCheckboxIndex === index) {
    setSelectedCheckboxIndex(null); // 取消选中当前复选框
  } else {
    setSelectedCheckboxIndex(index); // 选中新的复选框
  }
};