Vue Component Instance
Objects
Vue has a set of objects in the component instance.
| Object | Description |
|---|---|
| $attrs | Represents the fallthrough attributes and event listeners set on the component tag. |
| $data | Represents the properties stored in the data part of the Vue instance. |
| $el | Represents the root DOM node of the Vue component. |
| $parent | Represents the Vue instance of the parent component. |
| $props | Represents the props declared in the receiving component. |
| $refs | Represents the DOM elements marked with the built-in 'ref' attribute. |
| $root | Represents the Vue instance of the root component of the total Vue application. |
| $slots | Represents the slots provided by the parent component. |
Methods
Vue has a set of methods in the component instance that can be reached with the with the 'this' keyword.
| Method | Description |
|---|---|
| $emit() | triggers a custom event that is used to communicate up to the parent component |
| $forceUpdate() | forces a re-render of the Vue application |
| $nextTick() | waits for the DOM update cycle of the current Vue component to finish before executing |
| $watch() | is used to create watchers, and returns a stop function we can use to stop the watcher |
