條件判斷能否顯示
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>vue的邏輯判斷學習</title> 6 <script type="text/javascript" src="./js/vue.js"></script> 7 <script type="text/javascript"> 8 9 window.onload= function(){ 10 11 var app = new Vue({ 12 el:"#a", 13 data:{ 14 //能否顯示 15 seen:true, 16 seen1:false 17 } 18 19 }); 20 21 } 22 23 </script> 24 </head> 25 <body> 26 27 <div id="a"> 28 <!-- 使用vue的判斷標簽來顯示或者隱藏元素 --> 29 <p v-if="seen">你能看見我</p> 30 <span v-if="seen1">你不能看見我</span> 31 <!-- 判斷 if else 隨機出現--> 32 <div v-if="Math.random() > 0.5"> 33 現在你能看見我 34 </div> 35 <div v-else> 36 你現在看不見我 37 </div> 38 39 </div> 40 </body> 41 </html>