Handling Edge Cases — Vue.js | vue inline template
Thispageassumesyou’vealreadyreadtheComponentsBasics[1].Readthatfirstifyouarenewtocomponents.Allthefeaturesonthispagedocumentthehandlingofedgecases,meaningunusualsituationsthatsometimesrequirebendingVue’srulesalittle.Notehowever,thattheyallhavedisadvantagesorsituationswheretheycouldbedangerous.Thesearenotedineachcase,sokeeptheminmindwhendecidingtouseeachfeature.Element&ComponentAccessInmostcases,it’sbesttoavoidreachingintoothercomponentinstancesormanuallymanipulatingDOMelements.Thereareca...
This page assumes you’ve already read the Components Basics[1]. Read that first if you are new to components.
All the features on this page document the handling of edge cases, meaning unusual situations that sometimes require bending Vue’s rules a little. Note however, that they all have disadvantages or situations where they could be dangerous. These are noted in each case, so keep them in mind when deciding to use each feature.
Element & Component AccessIn most cases, it’s best to avoid reaching into other component instances or manually manipulating DOM elements. There are cases, however, when it can be appropriate.
Accessing the Root InstanceIn every subcomponent of a new Vue instance, this root instance can be accessed with the $root property. For example, in this root instance:
// The root Vue instancenew Vue({data: {foo: 1},computed: {bar: function () { /* ... */ }},methods: {baz: function () { /* ... */ }}})A...