Mengenal untuk Memberi nilai pada Conditional v-if di Vue.js

Pada tutorial ini kita akan belajar tentang Memberi nilai pada Conditional (pengandaian) v-if di Vue.js, Conditional dikenal juga dengan istilah ‘jika-maka’. Conditional pada Javascript merupakan suatu perintah yang digunakan untuk memilih satu aksi dari beberapa kemungkinan dengan syarat tertentu.

Seperti dikatakan sebelumnya bahwa directive v-if memiliki nilai default yaitu true, jika pada contoh sebelumnya terdapat code:

<b v-if="tampil"> {{ pesan }} </b>

Maka sesungguhnya scriptnya adalah seperti ini:

<b v-if="tampil == 'ada' "> {{ pesan }} </b>

Kita akan melanjutkan dengan memberi nilai pada variable tampil dengan selain kata true, langsung saja berikut contoh scriptnya:

<!DOCTYPE html>
<html>
<head>
	<title></title>
</head>
<body>
	<div id="app">
		<b v-if="tampil == 'ada' "> {{ pesan }} </b>
	</div>
	<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
	<script type="text/javascript">
		new Vue(
		{
			el: '#app',
			data: {
				tampil: 'ada',
				pesan: 'belajar memberi nilai pada v-if di vue.js'
			}
		})
	</script>
</body>
</html>

Maka hasilnya adalah akan muncul text belajar memberi nilai pada v-if di vue.js