onMounted 是 Vue 中的组件挂载生命周期钩子,其作用是在组件挂载到 DOM 后执行初始化操作,例如获取 DOM 元素的引用、设置数据、发送 HTTP 请求、注册事件监听器等。它在组件挂载时仅调用一次,如果需要在组件更新后或销毁前执行操作,可以使用其他生命周期钩子。

Vue 中 onMounted 的作用
onMounted 是 Vue 生命周期钩子之一,表示组件被挂载到 DOM 后调用。其主要作用是:
执行与组件挂载相关的操作
在组件挂载到 DOM 后,可以执行一些初始化操作,例如:
立即学习“前端免费学习笔记(深入)”;
- 获取 DOM 元素的引用
- 设置数据或属性
- 发送 HTTP 请求
- 注册事件监听器
完成数据请求或异步操作
如果需要在组件挂载后获取数据或执行需要时间的操作,可以在 onMounted 钩子中进行。这确保了数据或操作完成后,组件能够做出相应的响应。
例如:
注意:
- onMounted 钩子只在组件挂载时调用一次。
- 如果需要在组件更新后执行操作,可以使用 onUpdated 钩子。
- 如果需要在组件销毁前执行清理操作,可以使用 onBeforeUnmount 钩子。










