Class绑定

知识点

  • v-bind:class

v-bind:class

为html标记绑定样式单class属性。

  1. <div id="myApp">
  2. <div v-bind:class="{active:isActive}">红色文本1</div>
  3. <div :class="{active:isActive}">红色文本2</div>
  4. <button @click="btnClick">改变class吧</button>
  5. </div>
  6. <script>
  7. var myApp = new Vue({
  8. el: '#myApp',
  9. data: {
  10. isActive: true,
  11. },
  12. methods: {
  13. btnClick: function(){
  14. this.isActive = false;
  15. },
  16. },
  17. });
  18. </script>

源文件

小马视频频道

http://komavideo.com