Rumah  >  Artikel  >  hujung hadapan web  >  Apakah kegunaan $refs dan $el dalam vue

Apakah kegunaan $refs dan $el dalam vue

WBOY
WBOYasal
2022-02-15 15:34:285047semak imbas

Penggunaan: 1. "$refs" digunakan untuk mendaftarkan maklumat rujukan untuk elemen atau subkomponen, sintaksnya ialah "this.$refs.(ref value)" atau "this.$refs.(ref value) .method () "; 2. "$el" digunakan untuk mendapatkan elemen DOM yang dikaitkan dengan contoh Vue, sintaksnya ialah "this.$refs.component".

Apakah kegunaan $refs dan $el dalam vue

Persekitaran pengendalian artikel ini: sistem Windows 10, versi Vue 2.9.6, komputer DELL G3.

Apakah kegunaan $refs dan $el in vue?

ref digunakan untuk mendaftarkan maklumat rujukan untuk elemen atau sub-komponen

ref Terdapat tiga jenis Penggunaan:

1. Tambahkan ref pada elemen biasa, gunakan ini.$refs (nilai ref) untuk mendapatkan elemen dom

2. Tambahkan ref pada sub-. komponen, gunakan ini.$refs (nilai ref) Apa yang diperoleh ialah contoh komponen, dan semua kaedah komponen boleh digunakan. Apabila menggunakan kaedah, anda boleh menggunakannya secara langsung ini.$refs.(ref value).method().

3. Cara menggunakan v-for dan ref untuk mendapatkan set tatasusunan atau nod dom

Jika anda ingin menambah refs yang berbeza melalui v-for traversal, ingat untuk menambah tanda : , iaitu: ref = sesuatu Pembolehubah;

Ini adalah sama dengan atribut lain Jika ia adalah nilai tetap, tidak perlu menambah tanda : Jika ia adalah pembolehubah, ingat untuk menambah : tanda. (Jika titik bertindih ditambah, ini bermakna yang berikut ialah pembolehubah atau ungkapan; jika tiada titik bertindih, ini bermakna pemalar rentetan yang sepadan (String)

Perangkap yang perlu diberi perhatian ialah:

1. ref Ia perlu tersedia selepas pemaparan DOM selesai Apabila menggunakannya, pastikan DOM telah dipaparkan Sebagai contoh, panggilnya dalam kitaran hayat yang dipasang(){}, atau panggilnya dalam ini.$nextTick(()=>{}). hanya perlu gelung untuk mendapatkan satu rujukan 🎜>

vm.$el

Dapatkan elemen DOM yang dikaitkan dengan contoh Vue; dapatkan tabControl komponen tersuai dan dapatkan OffsetTopnya Anda perlu mendapatkan komponen dahulu Tetapkan atribut ref='a name (tabControl2)' dalam komponen,

dan kemudian gunakan ini. $refs.tabControl2 untuk mendapatkan komponen

Ingat: atribut ref, apabila mendapatkan komponen, anda perlu menggunakan $refs

untuk mendapatkan OffsetTop Komponen bukan elemen DOM dan tidak mempunyai OffsetTop. Ia tidak boleh diperolehi dengan mengklik .OffsetTop, jadi ia perlu diperolehi melalui elemen DOM dalam komponen

[Cadangan berkaitan: "

tutorial vue.js

"] <.>

Atas ialah kandungan terperinci Apakah kegunaan $refs dan $el dalam vue. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn