How to use the swiper/dist/js/swiper.js function in swiper

useEffect(() => {
    new Swiper('.swiper-container', {
      loop: true, // 循环模式选项
      autoplay: {
        disableOnInteraction: false
      }
    })
  })
  return (

blcokShowStart=0,//将要展示的区块范围--开始值
        blcokShowEnd=blockheight;//将要展示的区块范围--结束值
    this.dom="swiper-container"+new Date().getTime();
    let bw=`<div class="swiper-container ${this.dom}">
              <div class="swiper-wrapper"></div>
              <div class="swiper-button-prev"></div>
              <div class="swiper-button-next"></div>
            </div>`;
    $('#blockswiper').html(bw);
    // 处理显示方式
    if(blockNew&gt;blockheight){
      blockNew=blockheight;
    }
    blcokShowStart= (blockNew-blcokInterval)&gt;0 &amp;&amp; (blockNew-blcokInterval) || 0;
    blcokShowEnd= (blcokShowStart+2*blcokInterval)&lt;=blcokShowEnd &amp;&amp; (blcokShowStart+2*blcokInterval) || blcokShowEnd;
    this.blockSwiper = new Swiper("."+this.dom, {
      slidesPerView:parseInt(document.body.clientWidth/250),
      slidesPerGroup: parseInt(document.body.clientWidth/250),
      mousewheel: true,
      virtual: {
        slides: (function () {
          var slides = [];
          for (var i = blcokShowStart; i &lt;= blcokShowEnd; i++) {
            slides.push(i);
          }
          return slides;
        }()),
        cache: false,
        renderSlide:(slide, index)=&gt;{
          return `<div data-con="${slide}" class="swiper-slide"> 
                    <div class="${styles.blockSwiper} ${styles.blockHeight} ${styles.dark} bg">
                      <p class="${styles.blockHeightTitle}"> 区块高度</p></div></div>

componentDidMount() {
        new Swiper(this.swiperID, {
            pagination: {
                el: this.paginateID,
            },
            observer: true,
        });
    }

componentDidMount() {
    this.swiper = new Swiper(ReactDOM.findDOMNode(this), {...this.props});
  }

componentWillReceiveProps(nextProps) {
    if (this.props.rebuildOnUpdate && typeof this.swiper !== 'undefined') {
      this.swiper.destroy(true, true);
      this.swiper = new Swiper(ReactDOM.findDOMNode(this), {...nextProps});
    }
  }

componentDidMount() {
    this.__gallery = new Swiper(this.$root, {
      autoplay: {
        delay: 5000,
      },
      pagination: {
        el: this.$bulletsContainer,
        type: 'bullets',
        clickable: true,
        bulletElement: 'button',
        bulletClass: this.props.classes.bullet,
        bulletActiveClass: this.props.classes.bulletActive,
      },
      ...this.props.swiperProps,
    });
  }

componentDidUpdate() {
    if (this.props.rebuildOnUpdate && typeof this.swiper !== 'undefined') {
      this.swiper.destroy(true, true);
      this.swiper = new Swiper(ReactDOM.findDOMNode(this), {...this.props});
    } else if (this.props.shouldSwiperUpdate && typeof this.swiper !== 'undefined') {
      this.swiper.update();

      const numSlides = this.swiper.slides.length;
      if (numSlides <= this.swiper.activeIndex) {
        const index = Math.max(numSlides - 1, 0);
        this.swiper.slideTo(index);
      }
    }

    if (this.props.activeSlideKey) {
      let activeSlideId = null;
      let id = 0;
      React.Children.forEach(this.props.children, child => {
        if (child) {
          if (child.key === this.props.activeSlideKey) {