前端面试题 Vue 中的 生命函数(钩子函数)

目录

一，生命周期(钩子函数) 的简介

二，四类钩子函数的 触发条件 及 使用方法

钩子函数声明的位置:

1. Lifecycle-初始化 beforeCreate 和 created

2.Lifecycle-挂载 beforeMount 和 mounted

3.Lifecycle-更新 beforeUpdate 和 updated

4.Lifecycle-销毁 beforeDestroy 和 destroyed

---

一，生命周期(钩子函数) 的简介

        生命周期函数 又叫 钩子函数, 像它的名字一样,这也是个函数,与其他 methods 中定义的函数不同的是,Vue 中已经规定好了他的触发条件,而这些不同的触发条件就是 一个 Vue 文件从初始化到删除关闭必定经历的一些时间点,而我们就可以通过这些时间点进行各种操作

        真正的钩子函数有很多,这里只介绍四类八个最常用的,如果想进行深入了解,请点击一下到这里去看看,这是官网,如果你只是正常工作开发或者面试需要,那么这篇文章可能会对您有些帮助

        常用的钩子函数分为四类:

初始化	beforeCreate	created
挂载	beforeMount	mounted
更新	beforeUpdate	updated
销毁	beforeDestroy	destroyed

如下是一个 Vue 的生命周期顺序:

二，四类钩子函数的 触发条件 及 使用方法

钩子函数声明的位置:

四类函数都是需要与 methods 同级声明,并且不可被 methods 调用,以 updated 举例如下

export default {
  data () {
  },
  methods: {
  },

  // 钩子函数和 methods 同级声明
  updated () {
    console.log('看到了吗 声明到这个位置');
  }
}