组件运行过程

组件完整的生命周期包括：组件创建 -> 组件运行 -> 组件销毁，由此可见，组件生命周期强调的是一个时间段，流程如下图所示：

常用生命周期函数及说明

vue 框架为组件内置了不同时刻的生命周期函数，生命周期函数会伴随着组件的运行而自动调用。常用的组件生命周期函数：

1、当组件被创建完毕之后，会自动调用 created 函数（实际开发中，最常用的生命周期函数）

2、当组件被成功渲染到页面之后，会自动调用 mounted 函数

3、当组件被销毁完毕之后，会自动调用 unmounted 函数

4、当组件被重新渲染完毕之后，会自动调用 updated 函数（当组件的 data 数据更新之后，vue 会自动重新渲染组件的 DOM 结构，从而保证 view 视图展示的数据和 model 数据源保持一致）

组件中全部的生命周期函数

注意事项

1、beforeCreated 在组件的 data 数据未准备好之前就已经执行，所以在此函数内发起 ajax 请求，请求到的数据无法绑定到 data 中

2、上面是 OptionsAPI 中的用法，在 CompositionAPI 中，除 created 函数在 setup 期间自动调用外，其它函数均保留，在函数前加 on，比如：mounted => onMounted，如此即可