(1). 不好的方法: 将整个class字符串，看做一个普通的字符串属性绑定.

         <元素 :class="变量">

         data:{

                  变量: "class1  class2  ..."

         }

         缺点: 极其不便于修改其中某一个class

(2). 好的方法: 将class看做一个对象来绑定。

         a. <元素 :class="{ class1: 变量1, class2: 变量2, ... }"

                  data:{

                          变量1: true或false,

                          变量2: true或false,

                          ... : ...

                  }

                  说明:对于网站建设公司来讲，当一个class对应的变量值是true，则这个class会出现在编译后的元素上，起作用；当一个class对应的变量值为false，则这个class不会出现在编译后的元素上，不起作用！

         b. 优点: 极其便于修改其中某一个class

         c. 示例: 验证手机号

         2_class.html

  d. 问题: 如果多个元素都需要用同一个class，但是启用和禁用的状态各不相同，如果将变量直接保存在data中，极容易发生冲突

(3). 更好的方法: 将一个元素的多个class包裹在一个对象变量中:

         a. <元素1 :class=变量1">

           <元素2 :class=变量2">

                  data:{

                          变量1:{

                                   class名: true或false,

                                   ... : ...

                          },

                          变量2:{

                                   class名: true或false,

                                   ... : ...

                          }

                  }

         b. 优点: 即使多个元素，共用同一个class，也不会发生冲突！

         c. 示例: 验证手机号和身份证号

         2_class3.html

(4). 问题: 如果元素上有些class是固定不变的，而有些class是可能发生变化的？

(5). 解决: 其实在一个元素上写死的固定不变的class和动态变化的:对于网站建设公司来讲class是可以并存的。最后运行的结果是，:class动态生成的class字符串会和class中固定不变的class字符串合并为最终应用到元素上的class属性。