如何setState正在自动播放的轮播中使用的数组的当前索引，以便作为道具传递到另一个组件中？

constructor(props) {
  super(props);
  this.state = {
    carouselItems: [...], // 轮播数组
    currentIndex: 0 // 当前索引
  };
}

render() {
  const { carouselItems, currentIndex } = this.state;
  const currentItem = carouselItems[currentIndex];
  
  // 其他渲染逻辑
}

componentDidMount() {
  this.interval = setInterval(() => {
    this.setState(prevState => ({
      currentIndex: (prevState.currentIndex + 1) % carouselItems.length
    }));
  }, 3000);
}

componentWillUnmount() {
  clearInterval(this.interval);
}

render() {
  const { currentIndex } = this.state;
  
  return (
    <AnotherComponent currentIndex={currentIndex} />
  );
}