onUpdated()

注册一个回调，以便在组件由于响应状态更改而更新其 DOM 树后，调用。

类型

function onUpdated(callback: () => void): void

细节

父组件的更新钩子，在其子组件之后，被调用。

在组件的任何 DOM 更新后，调用此钩子，这可能是由不同的状态更改引起的。如果您需要在特定状态更改后，访问更新的 DOM，请改用nextTick()。

在服务器端渲染期间，不会调用此挂钩。

不要在更新的钩子中改变组件状态。这可能会导致无限更新循环！

例子

访问更新的 DOM：

<script setup>
import { ref, onUpdated } from 'vue'

const count = ref(0)

onUpdated(() => {
  // text content should be the same as current `count.value`
  console.log(document.getElementById('count').textContent)
})
</script>

<template>
  <button id="count" @click="count++">{{ count }}</button>
</template>