Vue3代码运行步骤
- 浏览器加载 index.html。
- 加载并执行 main.js。
- 使用 createApp()创建 Vue 应用实例。
- 注册路由和状态管理(如果有)。
- 挂载 Vue 应用到 DOM(如 #app)。
- 解析根组件 App.vue。
- 执行组件的生命周期钩子。
- 渲染子组件。
- 响应式数据更新,动态更新页面。
当 Vue 实例启动后,组件会经历以下生命周期钩子:
- onBeforeCreate:实例初始化之前。
- onCreated:实例创建完成,数据和事件已初始化,但未挂载 DOM。
- onBeforeMount:模板编译完成,但尚未挂载到 DOM。
- onMounted:组件挂载到 DOM,页面渲染完成。
- onUpdated:响应式数据更新后,重新渲染。(Vue 会自动更新 DOM)
- onDestroyed:组件销毁时执行清理操作。
https://keysqiu.github.io/2025/11/30/Vue/Vue3%E4%BB%A3%E7%A0%81%E8%BF%90%E8%A1%8C%E6%AD%A5%E9%AA%A4/
All articles on this blog are licensed under CC BY-NC-SA 4.0 unless otherwise stated.
Comments
