vue中动态添加class类进行显示隐藏

< div class= "status_button" >

< el-button type= "success" @click=" checkSite" >查岗 el-button >

< el-button type= "danger" >视频 el-button >

div >

< div class= "check_button" :class="[ this. flag? 'show': 'hidden']" >

< ul class= "cl" >

< li >用xinhic li >

< li >xin231 li >

ul >

div >

通过点击按钮进行显示隐藏

data() {

return {

flag: false,

}

},

methods: {

getdata() {

this. $axios. post( 'http://yapi.xxxxxxx'). then( res => {

console. log( res)

})

},

checkSite() {

this. flag = ! this. flag

}

}

三元表达式需要写在数组中 点击按钮的时候需要改变flag的状态  这里的flag相当于一个开关