onUpdated()
Registers a callback run after the component re-renders the DOM.
Syntax
onUpdated(callback): void Parameters
| Name | Type | Required | Description |
|---|---|---|---|
callback | () => void | No | Function run after a reactive update patches the DOM. |
Returns
void — Nothing; registers the hook.
Examples
<script setup lang="ts">
import { ref, onUpdated } from 'vue';
const count = ref(0);
onUpdated(() => {
console.log('DOM updated, count is', count.value);
});
</script>
<template><button @click="count++">{{ count }}</button></template>
Notes
Runs after every re-render caused by a reactive change, when the DOM is in
sync with state. Do not mutate state here without a guard, as it can cause an
update loop. For one-time post-update work prefer awaiting nextTick().