1. 程式人生 > >Vue學習筆記2———條件語句

Vue學習筆記2———條件語句

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<script src="js/Vue.js"></script>
	<body>
		<div id='app'>
			<p v-if="yes">苦逼後端被迫學習Vue!</p>
			<p v-show="no">苦逼後端被迫學習Vue!</p>
			
			<p v-if="Math.random()>0.5">這個數比0.5大</p>
			<p v-else>這個數比0.5小</p>
			
			<p v-if="type === 'A'">A</p>
			<p v-else-if="type === 'B'">B</p>
			<p v-else-if="type === 'C'">C</p>
			<p v-else>Other</p>
		</div>
		
		<script>
			new Vue({
				el:'#app',
				data:{
					yes:true,
					no:false,
					type:'B'
				}
			})
		</script>
	</body>
</html>