VUE 组件重新渲染（组件重载）无缝滚动切换重新从顶部开始播放

 

1.使用 v-if

v-if可以实现 true (加载)和false(卸载)

// html 
 
          

            
            
          


// js
data() {
	return {
		isShow: true,
	}
}
method: {
    // 切换
    checkedChange(index){
      this.isShow = false
      this.activeIndex = index
      this.curActiveData = this.listData[index] || {}
      // 建议加上 nextTick 微任务 
	  // 否则在同一事件内同时将tableShow设置false和true有可能导致组件渲染失败
      this.$nextTick(function(){
        // 加载,重新渲染无缝滚动组件
        this.isShow = true
      })
      
    },
}