1和之前不同,这里我们data放入布尔值;相当于作为开关来控制class是否调用
2注意这种写法是:class{属性:a,属性:b}。
<style>
.red{
color: red;
}
.blue{
background: blue;
}
</style>
<script src="vue.js"></script>
<script>
window.onload=function(){
new Vue({
el:'#box',
data:{
a:true,
b:false
},
methods:{
}
});
};
</script>
</head>
<body>
<div id="box">
<strong :class="{red:a,blue:b}">文字...</strong>
</div>
</body>
网友评论