如何使用React/Ionic设置active IonicSegmentButton？

import React, { useState } from 'react';
import { IonSegment, IonSegmentButton } from '@ionic/react';

const MyComponent = () => {
  const [activeButton, setActiveButton] = useState(0);

  const handleButtonClick = (index) => {
    setActiveButton(index);
  };

  return (
    <IonSegment value={activeButton} onIonChange={handleButtonClick}>
      <IonSegmentButton value={0}>
        Button 1
      </IonSegmentButton>
      <IonSegmentButton value={1}>
        Button 2
      </IonSegmentButton>
      <IonSegmentButton value={2}>
        Button 3
      </IonSegmentButton>
    </IonSegment>
  );
};

export default MyComponent;

import React from 'react';
import { IonSegment, IonSegmentButton } from '@ionic/react';

const MyComponent = () => {
  return (
    <IonSegment>
      <IonSegmentButton checked={true}>
        Button 1
      </IonSegmentButton>
      <IonSegmentButton>
        Button 2
      </IonSegmentButton>
      <IonSegmentButton>
        Button 3
      </IonSegmentButton>
    </IonSegment>
  );
};

export default MyComponent;