How to determine when Vue has finished updating the DOM? How to determine when Vue has finished updating the DOM? vue.js vue.js

How to determine when Vue has finished updating the DOM?


Vue batches DOM updates and performs them asynchronously for performance reasons. After a data change, you can use Vue.nextTick to wait for the DOM updates to finish:

subtasks.push({});Vue.nextTick(function () {  // DOM updated});

If you are using it inside a component method where this is available (and a reference to the component), you can use:

this.$nextTick(function () {  // DOM updated});

References:

Vue.nextTick

vm.$nextTick


If vue does not have a callback for this you can use a MutationObserver listener on the parent: https://developer.mozilla.org/en/docs/Web/API/MutationObserver


This seem to work for me

mounted() {    window.addEventListener('load', (event) => {    ...    });  },