Vue生命周期详解

一、前言

在使用Vue进行实际开发中，经常在created，mounted等生命周期钩子函数内进行数据，逻辑的处理，但基本都是看别人在哪个生命周期内请求数据，在哪个生命周期内操作DOM，自己也照搬如此使用，是“知其然而不知其所以然的”状态。今儿趁着手头工作忙完这段时间，特别研究了一下生命周期，记录一下自己的学习笔记。

二、生命周期

2.1、生命周期的四个阶段和8个生命周期钩子函数详解

2.1.1、阶段一

包含的生命周期钩子函数：
beforeCreate、created；
beforeCreate、created分析：
beforeCreate：只执行一次，可以在其中加个loading事件，加载实例的时候触发，已经可以拿到this，这个阶段还没有initState，数据还没有代理到this上，没有实现响应式数据，所以在这个阶段不可以请求数据。不常用；
created：只执行一次，组件的props/data/methods都已创建好，都处于可用状态。但是组件的模板结构尚未生成，不能操作dom。可在此阶段调用methods中的方法，请求服务器的数据，并把数据转存到data中，供template模板渲染时使用，非常常用。

2.1.2、阶段二

包含的生命周期钩子函数：