概述
vue基础-动态class
目标:用v-bind给标签class设置动态的值
- 语法
- :class = “{类名 : 布尔值}”
- true使用，false不用
<template>
<div>
<button @click="bl = !bl">点击按钮布尔值取反</button>
<!-- :class="{ 类名 ：布尔值}" -->
<div :class="{red: bl}">
盒子
</div>
</div>
</template>
<script>
export default {
data () {
return {
bl:true
}
}
}
</script>
<style>
.red{
transform: all 1s;
background-color: red;
}
</style>
最后
以上就是迷人麦片为你收集整理的vue基础-动态class / class = “{类名 : 布尔值}“的全部内容，希望文章能够帮你解决vue基础-动态class / class = “{类名 : 布尔值}“所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。
本图文内容来源于网友提供，作为学习参考使用，或来自网络收集整理，版权属于原作者所有。
发表评论 取消回复