解决Vue的button按钮显示隐藏问题
解决Vue的button按钮显示隐藏问题单个按钮控制显示隐藏<template><div><div v-if="isshow">{{isshow}}</div><button @click="change()">点击</button></div><...
·
解决Vue的button按钮显示隐藏问题
单个按钮控制显示隐藏
<template>
<div>
<div v-if="isshow">{{isshow}}</div>
<button @click="change()">点击</button>
</div>
</template>
<script>
export default({ name:'',
data(){ return{ isshow:false,
}
}, methods:{ change:function(){ this.isshow=!this.isshow
}
})
</script>
上面代码可以实现单个控制显示隐藏,但是我想把this.isshow=!this.isshow写在标签上该怎么写?
<template>
<div>
<div v-if="isshow">{{isshow}}</div>
<button @click="isshow = !isshow">点击</button>
</div>
</template>
<button @click="isshow = !isshow">点击</button>
实例代码
<div class="footer" v-if="showButton"><button @click="showAddComment(1)" :hidden="isHidden">评论</button></div>
data数据
showButton: {}, //条件判断是否显示button按钮
isHidden:true //是否隐藏button按钮
method方法:
getData(){ //初始数据
//@author Mike修改增加 getUrlParam('showButton')
console.log('showButton+++++++='+getUrlParam('showButton'))
if(getUrlParam('showButton') == 0){
console.log('进来了++++')
this.showButton = 0
if(this.showButton == 0){
this.isHidden = true
}
}else {
console.log('进来了----')
this.showButton = 1
if(this.showButton == 1){
this.isHidden = false
}
}
},
更多推荐
已为社区贡献3条内容
所有评论(0)