进到一个页面或者一个组件的时候，

可能需要马上去做一些请求，也有可能对 DOM 进行操作

那这些代码应该写在什么地方呢？

每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数，这给了用户在不同阶段添加自己的代码的机会。

下面介绍几个常用的生命周期钩子

created

在 created 钩子里，我们已经有了响应式的 data，并且事件也已经就绪。模板和虚拟 DOM 还没被挂载或渲染，

所以这个时候可以做一些对 data 赋初始值的工作（请求数据）。

mounted

在 mounted 的时候，你已经得到了响应式的组件，也可以通过 this.$el 获取已经被渲染的 DOM，

在这个阶段，我们可以去修改 DOM 了。

updated

updated 钩子会在组件的 data 发生变化 并且 DOM 已经重新渲染之后 调用，

如果你想在一个属性变化之后去做 DOM 操作，就可以在这个阶段进行。

Vue 官方给出了生命周期图示便于参考：