Glidejs中轮播设置为自动播放时的触发函数

Question

我有一个 GlideJS 旋转木马，我试图handleAnimation在每张幻灯片变为活动状态后调用我的函数。

如果我点击它它会起作用，但我不知道如何在轮播自动播放时让它运行。

componentDidMount = () => {

  const carousel = new Glide(this.myRef.current, {

    autoplay: 3000,

    rewind: true,

  })

  carousel.mount()

  const myTriggers = document.querySelectorAll(".slide__trigger")

  myTriggers.forEach(trigger => {

    const triggerStep = trigger.getAttribute("data-step")

    trigger.addEventListener("click", () =>

      this.handleAnimation(triggerStep)

    )

  })

}

我应该使用 GlideJS 的事件处理程序之一吗？感谢您的任何建议！

Answer 1

如果有事件处理程序，你必须肯定地使用它。关于 Glide 文档，一旦项目变为活动状态就会触发事件，您可以在动画开始时使用run或事件来运行您的函数：movecarousel.on('move', this.handleAnimation(triggerStep))并在动画结束后使用move.afterorrun.after运行：carousel.on('move.after', this.handleAnimation(triggerStep))如果这些活动不符合您的需要，请尝试其他活动。