聊聊 vue 生命周期

一、常用的常用的生命周期钩子：

mounted: 发送 ajax 请求、启动定时器、绑定自定义事件、订阅消息等【初始化操作】

mounted() {console.log('vm 实例被挂载之后：mounted');this.timer = setInterval(() => {...}
}

beforeDestroy: 清除定时器、解绑自定义事件、取消订阅消息等【收尾工作】

beforeDestroy() {console.log('vm 实例被挂载将要被销毁：beforeDestroy');clearInterval(this.timer);
}

关于销毁 Vue 实例

(1) 销毁后借助 vue 开发者工具看不到任何信息

(2) 销毁后自定义事件会失效，但原生 DOM 事件依然有效

(3) 一般不会在 beforeDestroy 操作数据，因为即便操作数据，也不会再出发更新流程了

vue 生命周期示意图

聊聊 vue 生命周期相关推荐

标注图+部分举例聊聊Vue生命周期
"你不需要立马弄明白所有的东西,不过随着你的不断学习和使用,它的参考价值会越来越高." 现在项目中遇到了,好好回头总结一波Vue生命周期,以后用到的时候再来翻翻. 啥叫Vue生命周 ...
Vue 生命周期记录_学习笔记
官方给出的设计图入戏为了能更好的理解这个图呢,写了下面的demo <!DOCTYPE html> <html><head><meta charset=&qu ...
vue hot true 不起作用_从源码解读 Vuex 注入 Vue 生命周期的过程
第一篇文章我会结合 Vue 和 Vuex 的部分源码,来说明 Vuex 注入 Vue 生命周期的过程. 说到源码,其实没有想象的那么难.也和我们平时写业务代码差不多,都是方法的调用.但是源码的调用树会 ...
少侠请重新来过 - Vue学习笔记(二) - Vue生命周期
Vue 生命周期和钩子每一个vue实例创建时,会经历一段初始化的过程,同时会调用其生命周期钩子,实例的钩子this指向它的Vue实例,不需要在钩子用箭头函数. <template>< ...
vue生命周期图示中英文版Vue实例生命周期钩子
vue生命周期图示中英文版Vue实例生命周期钩子知乎上近日有人发起了一个 "react 是不是比 vue 牛皮,为什么?" 的问题,Vue.js 作者尤雨溪12月4日正面回应了该 ...
异步加载在Vue生命周期哪个阶段更合理
react高阶面试题中有这么一道:为什么异步请求数据在didMount阶段更合适?同为MVVM中的翘楚,Vue是否也有类似问题呢?另外,我在平时也无开发过程中也会发现,每个人选择的那个生命周期阶段去异 ...
一文带你吃透Vue生命周期（结合案例通俗易懂）
文章目录本篇学习目标 1. vue生命周期 1.0_人的-生命周期 1.1_钩子函数 1.2_初始化阶段 1.3_挂载阶段 1.4_更新阶段 1.5_销毁阶段 2. axios 2.0_axios基 ...
详解vue生命周期及每个阶段适合进行的操作
VUE生命周期的四个阶段 create 创建 -------- 创建vue实例并初始化 mount 挂载 -------- 把vue实例和视图进行关联 update 更新 ------- 监听数据与视 ...
Vue 生命周期LIFECYCLE是8个吗？
vue生命周期钩子个数是:11个. export const LIFECYCLE_HOOKS = [ 'beforeCreate', 'created', 'beforeMount', 'mounte ...

聊聊 vue 生命周期

聊聊 vue 生命周期相关推荐

最新文章

热门文章