1.使用 v-if
v-if可以实现 true (加载)和false(卸载)
// html
<vue-seamless-scroll ref="myseemless" v-if="isShow" :data="[curActiveData]" :class-
option="classOption" class="seamless-warp" style="height:100%;">
<ul class="listData">
<span class="title" v-html="curActiveData.gameRules"></span>
</ul>
</vue-seamless-scroll>
// 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
})
},
}