What are the ways to obtain DOM nodes in Vue3

1. Get the DOM node with native js:

document.querySelector(选择器) document.getElementById(id选择器) document.getElementsByClassName(class选择器) ....

2. Get the instance object of the current component in vue2:

Because each vue component instance contains a $refs object , whichstores the referenceof the correspondingDOMelement or component. So by default, the component's $refs points to an empty object.

You can first addref="name"to the component, and then obtain the corresponding element throughthis.$refs.nameand operate it.

3. Get the instance object of the current component in vue3:

This object is deactivated in the Vue3 framework, so you cannot use this.$refs to get the custom component ref. DOM node.

But vue3 comes with a function that can return the current component instance objectgetCurrentInstance. Through this function, you can get the object to save energy and see that the object contains refs in the interface.

The above is the detailed content of What are the ways to obtain DOM nodes in Vue3. For more information, please follow other related articles on the PHP Chinese website!