版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
<style type="text/css">
div#box{
width: 100px;
height: 100px;
color: darkgray;
}
.red{
background-color: red;
}
.blue{
background-color: blue;
}
</style>
</head>
<body>
<div id="app">
<button @click="isRed=!isRed">点我切换颜色</button>
<div id="box" v-bind:class="{red:isRed,blue:!isRed}">
我是盒子
</div>
</div>
<script src="node_modules/vue/dist/vue.js"></script>
<script>
const app=new Vue({
el:"#app",
data:{
isRed:true
}
});
</script>