true显示样式，flase不显示
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>vue的样式绑定</title> 6 <style type="text/css"> 7 .active{ 8 background-color: gold; 9 color:blue; 10 } 11 12 </style> 13 <script type="text/javascript" src="./js/vue.js"></script> 14 <script type="text/javascript"> 15 16 window.onload = function(){ 17 18 var app = new Vue({ 19 el:"#a", 20 data:{ 21 //激活 false 22 isactive:true 23 } 24 25 }); 26 } 27 28 </script> 29 30 </head> 31 <body> 32 33 <div id="a">人生最棒的是不后悔 34 <div v-bind:class="{ active:isactive }" style="width: 200px"> 35 人生最难的是不留遗憾 36 </div> 37 </div> 38 39 </body> 40 </html>