博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

vue中如何实现 样式绑定?

Posted on 2019-07-29 11:00  taigudaren  阅读(154)  评论(0编辑  收藏  举报

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vue 测试实例 - 菜鸟教程(runoob.com)</title>
<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
<style>
.active {
width: 100px;
height: 100px;
background: green;
}
</style>
</head>
<body>
<div id="app">
<div v-bind:class="{ active: isActive }"></div>
</div>

<script>
new Vue({
el: '#app',
data: {
isActive: true
}
})
</script>
</body>
</html>