fungsi ref di VueJS dan cara menggunakannya, jika saya bilang ketika kita menggunakan ref ini kita bisa mengambil data attribute dengan attribute yang kita buat, kita bisa mengambil valuenya, misa saya membuat attribute dengan nama data=”hello”, kita bisa mengambilnya bahkan mencetaknya, oke untuk tau lebih lanjut jangan kemana-mana ya teman-teman simak terus artikel ini.

di dalam vuejs ref termasuk ke dalam sepesial attrubutes, dan di dalam documentasi VueJS, ref sendiri berfungsi digunakan untuk mendaftarkan referensi ke elemen atau komponen anak. untuk belajar ref paling enak kita langsung masuk contoh kasusnya saja, disini untuk mengetahui fungsi ref di VueJS dan cara menggunakannya, saya akan menggunakan text input dan sebuah button.

Jadi Kasus untuk artikel kali ini adalah saya akan mencoba mengambil nilai dari sebuah value placeholder, dan value placeholder itu akan kita tampilkan di sebuah penampung yang saya beri data output, seperti yang saya tulis di atas jadi tidak hanya value dari inputannya tetapi value placeholderpun kita bisa ambil, dan untuk lebih jelasnya saya akan menambahkan tag h3 untuk mencetak tulisan yang ada di tag h3, oke langsung saja beginilah cara membuatnya:

Silahkan teman-teman copy saja untuk melihat hasilnya, disini saya menggunakan link CDN jadi ketika teman-teman copy, sudah berhasil melihat hasilnya, jika teman-teman ingin mencetak nilai text yang ada di h3 ganti sajadengan cara seperti ini:

bagaimana cukup simple bukan, dan attribute ref ini memang benar-benar spesial, oke jika teman-teman sudah mengcopy file di atas, maka akan menunjukan tampilan seperti yang saya punya seperti ini:

fungsi ref di VueJS dan cara menggunakannya

Dan saya rasa cukup sampai disini belajar kita tentang fungsi ref di VueJS dan cara menggunakannya, semoga bermanfaat dan sampai jumpa pada artikel selanjutnya terimakasih.