Vue 'mounted' Lifecycle Hook
Example
Using the mounted lifecycle hook to put the cursor inside the input field
as soon as the component is mounted.
<script>
export default {
mounted() {
this.$refs.inpName.focus();
}
}
</script>
Definition and Usage
The mounted lifecycle hook happens after the Vue component is mounted to the
DOM tree.
Because the component is mounted, we can access the properties that belong to the component instance such as
data or computed, and we can access the
component's DOM elements because they have just been mounted to the DOM.
Related Pages
Vue Tutorial: Vue Lifecycle Hooks
Vue Tutorial: The 'mounted' Hook
Vue Reference: Vue 'beforeMount' Lifecycle Hook