reactjs - 反応マルチカルーセルを使用していますが、カスタムドットを使用できません

Question

このカルーセルのクリック可能なカスタム ドットを取得する方法。カルーセルを移動するリスト項目のクリック イベントをバインドできません。カルーセルの前のアイテムと次のアイテムをクリックするにonClickは、アイテムとアイテムの間で適切な実装が必要ですli

リンクコードボックスの完全なコードは次のとおりです

const CustomDot = ({onMove,index,onClick,active}) => {   
   return (
    <ol class="carousel-indicators">
    <li data-target="#main-slide" data-slide-to="0" className={active ? "active" : "inactive"}     
      >How t bind the click event list item
  onClick={() => onClick()}>{React.Children.slide1}</li>
    <li data-target="#main-slide" data-slide-to="1" className={active ? "active" : "inactive"}
  onClick={() => onClick()}>{React.Children.slide2} </li>
    <li data-target="#main-slide" data-slide-to="2" className={active ? "active" : "inactive"}
  onClick={() => onClick()}>{React.Children.slide3} </li>
    </ol>
  );
};