vue v-bind绑定class时注意事项
2018-11-16 本文已影响0人
newway_001
<style>
.active {
width: 100px;
height: 100px;
background: green;
}
.text-danger {
background: red;
}
</style>
<body>
<div id="app">
<div v-bind:class="classObject"></div>
</div>
<script>
new Vue({
el: '#app',
data: {
classObject: {
active: true,
'text-danger': true
}
}
})
</script>
</body>
其中text-danger为什么要加'',不加引号class显示不了？
因为 {}内的代码是要拿去当js解析的，js中变量是没有用 ' - '号连接
就像 css中 font-size 是用 - 号连接
到了js中 就必须用驼峰的写法
