更改宽度时开始滑行

Question

我正在使用滑行转盘。我将它作为组件传递给了儿童物品。加载页面时，滑块可与无限循环配合使用。只要更改浏览器宽度而不重新加载，最后一张幻灯片就会跳到第一张幻灯片。如何预防这个错误？在componentDidMount中，有一个条件，如果宽度更改，它将重置滑块。

componentDidUpdate(prevProps) {
    if (
      children.length !== prevProps.children.length ||
      width !== prevProps.width
    ) {
      this.reinitSlider();
    }
  }

reinitSlider = () => {
    this.setState(
      {
        slides: [],
        currentSlide: 0,
        settings: this.props.settings
      },
      () => {
        this.slider = null;
        this.initSlider();
      }
    );
  };

--------------------------------------------------------------------
  if (children && Array.isArray(children) && children.length) {
      this.setState(
        {
          slides: children.map((el, i) => (
            <li className="glide__slide" key={i} data-slide={i}>
              {el}
            </li>
          ))
        },
        () => {
          const { settings } = this.state;
          this.slider = new Glide(`#${this.id}`, {
            autoplay: this.state.slides.length > 1 ? 5000 : false, // FIXME enable autoplay
            animationDuration: 1000,
            type: 'carousel',
            classes: {
              cloneSlide: 'clone'
            },
            animationTimingFunc: 'ease',
            perView: promoSlider ? 2 : 1,
            gap: promoSlider ? 30 : 0,
            breakpoints: promoSlider
              ? {
                  1100: {
                    perView: 2,
                    gap: 30,
                    peek: 30
                  },
                  600: {
                    perView: 1,
                    gap: 0,
                    peek: 0
                  }
                }
              : {},
            ...settings
          })