VUE的class类样式

原生写法：  <p class="red">我是一个P</p>

以下为VUE的类样式写法

    1. 第一种：传递数组方式，       注意： 这里的 class 需要使用 v-bind 做数据绑定 

　　 <h2 :class="['blue','fontsize']">我是一个H2</h2>

     2.第二种： 数组中使用三元表达式 

　　<h3 :class="[flg?'blue':'']">我是一个H3</h3>

     3.第三种：在数组中使用对象     

　　<h2 :class="['blue','fontstyles',{fontsize: true}]">我是H2ss</h2>

　4.第四种：给class传递对象(也可以，在data中创建好对象，然后传递给class)    注意： 对象可以加引号，也可以不加 

        <h2 :class="{'red':'true','fontstyles':'true',fontsize: true}">我是H2</h2>

          <p :class="msgstyle">我是使用对象名的方式</p>

 

　　<script>

      　　  var vm=new Vue({

         　　  el:'#app',

          　　 data:{

          　　     msgstyle:{

           　　        red: true,

                　　   fontsize: true,

               　　    fontstyles: true

             　　  }

          　　 },

          　　 methods:{}

        　　});

   　</script>