problem description
el-tab automatic cycle switch display
the environmental background of the problems and what methods you have tried
related codes
/ / Please paste the code text below (do not replace the code with pictures)
< template >
<div class="groupChart">
<el-tabs type="border-card" v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="AAA" name="first" :key=""first"">
<span v-if="isUpdate1">AAA</span>
</el-tab-pane>
<el-tab-pane label="BBB" name="second" :key=""second"">
<span v-if="isUpdate2">BBB</span>
</el-tab-pane>
</el-tabs>
</div>< / template >
< script >
export default {
name: "tabCircle",
data () {
return {
activeName: "first",
isUpdate1: true,
isUpdate2: false,
cir: null
}
},
methods: {
handleClick (tab) {
if (tab.name === "first") {
this.isUpdate1 = true
this.isUpdate2 = false
} else if (tab.name === "second") {
this.isUpdate1 = false
this.isUpdate2 = true
}
}
},
mounted () {
let count = 0
clearInterval(this.cir)
this.cir = setInterval(function () {
let arr = ["first", "second"]
// let count = 0
console.log(count, "00000")
this.handleClick(arr[count])
countPP
if (count > arr.length-1) {
count = 0
}
}.bind(this), 5000)
}
}< / script >
what result do you expect? What is the error message actually seen?
can automatically switch tab to display the corresponding content