Accessing components elements with Template Refs
In this section, we are going to improve the control of our components by learning how to access the DOM element.
When I first started to learn about Vue.js, I was astonished by how much could be accomplished without the need to access DOM elements. The Vue.js engine is structured in a way that we can accomplish all basic operations with the use of props, data, methods, and computed properties.
Just like everything else, there are times when we may need some extra control, and this can be achieved with the use of Template Ref
. Using this feature exposes the DOM element in which the Ref was defined. This would be the same as using querySelector
or getElementById
offered by vanilla JavaScript.
Same Refs different usage
You may be wondering why we are learning about Refs if we already learned about it at the start of the book to define the private properties of a component. Well, this Refs is different. It is defined with the...