創(chuàng)建Vue實例
快速創(chuàng)建邀泉，不再贅述嬉挡，可以查看其它筆記叛氨。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vue條件與循環(huán)</title>
</head>
<body>
<div id="app">
<header>條件與渲染的演示</header>
</div>
<script src="../js/vue.js"></script>
<script>
const app = new Vue({
el: '#app',
})
</script>
</body>
</html>
創(chuàng)建data對象
const app = new Vue({
el: '#app',
data:{
isShow:false
}
})
v-if
<div v-if="isShow">
你能看到我嗎道川？
</div>
瀏覽器打開
此時部翘，是看到 “你能看到我嗎材义？”信息的抓督。
因為isShow是false孩等，所以連這個dom節(jié)點都沒有創(chuàng)建的幕屹。
可以打開開發(fā)者工具(f12)满葛，點擊元素昌罩，查看阱穗。
點擊控制臺饭冬，輸入：
app.isShow = true
此時查看頁面元素。
v-show
<div v-show="isShow">
用來展示v-show效果
</div>
顯示結果與v-if 一樣揪阶，不同的地方就是v-show的節(jié)點昌抠，一開始就是被創(chuàng)建出來的，只是當isShow=false時應用了樣式display:none鲁僚，因此是不顯示的炊苫。
