对于实现页面逻辑交互等效果,我们必须知晓 vue 的生命周期,才能愉快的玩耍,知道我们写的东西应该挂载到哪里,vue 官方给出的 api 讲解的那叫一个简单啊,如下:
所有的生命周期钩子自动绑定 this 上下文到实例中,因此你可以访问数据,对属性和方法进行运算。这意味着你不能使用箭头函数来定义一个生命周期方法(例如 created: () => this.fetchTodos())。这是因为箭头函数绑定了父上下文,因此 this 与你期待的 Vue 实例不同,this.fetchTodos 的行为未定义。
下面附加一张生命周期图示
)
1 DOCTYPE html>
2
3
4
5
6