vue2项目开发中，需要一个功能，tab切换后，走马灯也要同步切换，查看官方文档后，发现有一个方法setActiveItem我们通过这个方法来实现切换。

tab操作

这边使用的是sync来更新active的，所以我们添加一个监听，监听到active的变化后，触发方法就可以了。

<div class="yujingzl">
  <div class="yujingzll">
    <tab :active.sync="active" :list="statuslist"></tab>
  </div>
  <div class="yujingzlr">
    稽核总览
  </div>
</div>
<div class="listBody">
  <el-carousel ref="carousel" :initial-index="active" :autoplay="false" height="300px">
    <el-carousel-item v-for="item in statuslist" :key="item">
      <div class="listBodyInner" v-for="(item,index) in listBody" :key="index">
        <div class="listBodyInnerItem1">{{ item.title }}</div>
        <div class="listBodyInnerItem2" v-for="(item2,index2) in item.childList" :key="index2">
          <img v-if="item2.type==0" src="../../../assets/icon_jingbao.png" alt="">
          <img v-else src="../../../assets/icon_chenggong.png" alt="">
          <div class="listBodyInnerItem2r">
            <span>{{ item2.desc }}</span>
            <p>{{ item2.title }}</p>
          </div>
        </div>
      </div>
    </el-carousel-item>
  </el-carousel>
</div>

监听参数变化

watch: {
    active() {
      this.getActive()
    }
  }

手动切换方法

getActive() {
  this.$refs.carousel.setActiveItem(this.active)
},