Untuk Menampilkan data dalam Vue.Js terdapat beberapa cara dan metode, diantaranya adalah declarative rendering, directive v-text, dan directive v-html, yang masing-masing memiliki karakter yang berbeda, mari kita bahas satu persatu cara menampilkan data dalam vue.js dengan berbagai variasinya.

Jika teman-teman bertanya, bagaimana jika ingin menampilkan teks dengan berbagai format, misalnya teks yang tebal ataupun miring? Jika kita menggunakan HTML kita cukup menambahkan tag <b> untuk menebalkan teks, ataupun tag <i> untuk memiringkan teks.

Sekarang bagaimana caranya jika menggunakan Vue,Js? Kita bisa menggunakan DIrective v-html, karna v-html itu letaknya ada didalam file HTML, tentunya dengan bantuan tag-tag HTML yang sudah kita bahas tadi itu bisa di implementasikan. Sebagai contoh untuk membuat teks ‘Selamat pagi Juara’ menjadi tebal, maka teman-teman cukup menambahkan tag <b> saja kan?

Tentunya tag <b> tsb, diletakkan pada saat teman-teman membuat variable pesan, jadi tag <b> tsb mengjepit teks “Selamat pagi Juara”, dan jangan lupa ubah pada tag HTMLnya ya, menjadi v-html, contoh:

dan untuk nilai dari variable pesan-nya juga kita bisa beri tag HTML yaa, contoh: