在 Vue 中，DOM 渲染完成发生在哪个生命周期钩子阶段？
考察说明
考查对 Vue 生命周期钩子执行时机，尤其是 DOM 渲染完成节点的理解。
回答思路
- 【回答框架 1】Vue 实例从创建到销毁经历多个生命周期钩子，其中 mounted 钩子在实例挂载完成后被调用，此时 DOM 已渲染完成，可安全访问和操作真实 DOM。
- 【回答框架 2】在 mounted 之前，created 钩子中实例已创建但尚未挂载，此时无法访问 DOM；beforeMount 钩子中即将挂载，DOM 尚未生成。
- 【回答框架 3】mounted 钩子中，模板已编译并渲染为真实 DOM，且已插入页面，因此适合执行依赖 DOM 的操作，如初始化第三方库、获取元素尺寸等。
- 【回答框架 4】若需在 DOM 更新后执行操作，应使用 nextTick 或 updated 钩子，但 mounted 是首次渲染完成的标志。
- 【回答框架 5】注意 mounted 不会保证子组件也已挂载，若需等待整个组件树挂载，可使用 vm.$nextTick 或递归检查。
- 【关键点 1】mounted 钩子表示 DOM 渲染完成，可操作真实 DOM。
- 【关键点 2】created 阶段无法访问 DOM，因为实例尚未挂载。
- 【关键点 3】mounted 适合初始化依赖 DOM 的库或执行测量。
- 【关键点 4】DOM 更新后需用 updated 或 nextTick，而非 mounted。
- 【关键点 5】mounted 不保证子组件挂载完成，需用 nextTick 等待。
- 【易错点 1】误以为 created 中可访问 DOM，实际此时 DOM 未生成。
- 【易错点 2】在 mounted 中直接修改数据可能导致额外渲染，应谨慎。
- 【易错点 3】忽略 mounted 与子组件挂载的时序差异，导致操作子组件 DOM 失败。