Element UI多个走马灯取消鼠标悬停不自动切换

element写轮播图时，鼠标悬停不会停止，需要用到以下核心代码

@mouseenter.native="delHandleMouseEnter"

前情提要：此html代码外面是循环遍历出的div，div数量是后台返回的，而且里面还包含着轮播图，所以有几个div就有几个轮播图，因为是多个轮播图，所以后期需要循环遍历index

具体写法： 

<div v-show="item.showBannerOrNo" class="block booth-banner">
            <el-carousel
              ref="carousel"
              arrow="never"
              indicator-position="none"
              height="310px"
              interval="2000"
              @mouseenter.native="delHandleMouseEnter(index)"
            >
              <el-carousel-item v-for="items in booteBanners" :key="items.id">
                <img :src="items.idView" alt="">
              </el-carousel-item>
            </el-carousel>
          </div>

核心方法：

// 鼠标移入卡片banner不停止
    delHandleMouseEnter(index) {
      this.$refs.carousel[index].handleMouseEnter = () => {}
    }

为了第一次鼠标进入就触发，需要在mounted方法中写，而且轮播图是多张，所以需要循环遍历index

mounted() {
    this.$refs.carousel.forEach((item, index) => {
      this.$refs.carousel[index].handleMouseEnter = () => {}
    })
  },