admin

9_Vue/3_vbind.html

@@ -29,11 +29,11 @@
         <!-- v-bind 指令 可以将变量数据绑定到元素的属性上 -->
          <!-- 只要标签属性值为变量那么就可以在属性前面添加 v-bind: 前缀 -->
         <img v-bind:src="imgUrl2" alt="">
-        <div v-bind:class="className">hello</div>
+        <div v-bind:class="className+' name1'">hello</div>
         <!-- 可以在指令中使用表达式 -->
         <div v-bind:class="className2+'3'">hello2</div>
         <!-- 可以在指令中使用条件表达式 -->
-        <h1 v-bind:class="{'active':isShow}"> 你好 </h1>
+        <h1 v-bind:class="[{'active':isShow},'name2']"> 你好 </h1>
         <!-- v-bind 可以缩写为 : -->
          <div :class="className">hello3</div>
     </div>
@@ -45,7 +45,7 @@
                 imgUrl2:"./img/download.png",
                 className:"div2",
                 className2:"div",
-                isShow:false,
+                isShow:true,
             }
         })
     </script>