if-else——Vue.js

一個簡單顯示是否中獎的頁面，客戶看到的是一個頁面，其實是兩個，只不過當其中一個頁面顯示時，另外一個看不見。

這裏運用到了隨機數，當隨機數大於0.5時，顯示中獎信息，反之，則是沒有中獎的信息

DOM

<div id="myView">
	<div v-if="result>0.5">恭喜您！中獎啦！</div>
	<div v-else>謝謝惠顧！</div>
</div>

 要顯示中獎信息，應使用v-if判斷獲得的隨機數是否大於0.5

另外一不中獎信息，則使用v-else

JS

<script>
	var myViewModel = new Vue({
		el: '#myView',
		data: {
			result : Math.random()
		}
	})
</script>

　　也能夠在控制檯輸出

頁面將同步爲

反之，如控制檯輸出myViewModel.result = 0.3

則顯示謝謝惠顧信息。