refs
July 4, 2022Меньше 1 минуты
$refs
$refs
is a magic property that can be used to retrieve DOM elements marked with x-ref
inside the component. This is useful when you need to manually manipulate DOM elements. It's often used as a more succinct, scoped, alternative to document.querySelector
.
<button @click="$refs.text.remove()">Remove Text</button>
<span x-ref="text">Hello 👋</span>
<div class="demo">
<div x-data>
<button @click="$refs.text.remove()">Remove Text</button>
<div class="pt-4" x-ref="text">Hello 👋</div>
</div>
</div>
Now, when the <button>
is pressed, the <span>
will be removed.