vue 钩子函数updated什么时候触发

当归10242024-05-09 10:22

触发时机

updated是Vue生命周期钩子函数之一，在组件的数据变化导致虚拟DOM重新渲染并应用到实际DOM之后触发。具体来说，updated会在以下几种情况下被触发：

初始渲染完成后：当组件首次渲染完成并将虚拟DOM渲染到实际DOM之后，updated钩子函数会被调用。

响应式数据变化时：当组件中的响应式数据发生变化时，虚拟DOM会重新渲染并应用到实际DOM，此时updated钩子函数会被调用。

需要注意的是，updated在虚拟DOM重新渲染后立即触发，此时实际DOM可能还没有更新完成。如果需要等待实际DOM更新完成后执行一些操作，则可以使用Vue.nextTick方法。

问题场景

外层传入一个父项id给子组件，需要更具这个id初始化列表
最初使用mounted钩子函数的时候，导致只有第一次的时候加载了数据

但是业务需要外层每次变化，内层组件都需要初始化列表

java 复制代码

  mounted() {
    console.log('costClassify mounted')
    this.refresh()
  },
  updated() {
    console.log('costClassify updated')
    this.refresh()
  }

但是这个地方使用watch好像也行