vue2 与 vue3 生命周期对比

周期对比

vue2	vue3
beforeCreate	setup
created	setup
beforeMount	onBeforeMount
mounted	onMounted
beforeUpdate	onBeforeUpdate
updated	onUpdated
activeted	onActiveted
deactiveted	onDeactiveted
beforeDestory	onBeforeUnmount
destoryed	onUnmounted

用法

vue2 中的生命周期与 data / methods 同级别以函数方式使用，比如 created() {}

data() {return {}
},
created() {...
}

vue3 中的生命周期 setup 在最外层，不需要按需加载，其他的生命周期得按需加载才能使用

import { omMounted } from 'vue'setup() {onMounted(() => { ... })
}

vue2 与 vue3 生命周期对比相关推荐

Vue2.和Vue3.生命周期的区别，对比。详解生命周期中的每个钩子函数，setup,
文章目录 #1.Vue2.的生命周期与Vue3.的生命周期对比图 #1.1白色背景图是Vue2.的生命周期,黑色背景图是Vue3.的生命周期. #2.Vue2.与Vue3.的生命周期函数的不同 #2. ...
Vue3 生命周期钩子函数
一.Vue3生命周期钩子 setup() : 开始创建组件之前,在 beforeCreate 和 created 之前执行,创建的是 data 和 method onBeforeMount() : 组 ...
Vue3 - 生命周期钩子函数（组合式 API）
前言 Vue 是组件化编程,从一个组件诞生到消亡会经历很多过程,这些过程就叫做生命周期.而伴随着生命周期,给用户使用的函数,就叫钩子函数,实际为操控生命周期. 本文主要对比 Vue2 生命周期,引出并 ...
Vue3 生命周期Hooks函数与调度器Scheduler的原理
大厂技术高级前端 Node进阶点击上方程序员成长指北,关注公众号回复1,加入高级Node交流群写在最前:本文章的目标 Vue3的生命周期的实现原理是比较简单的,但要理解整个Vue3的生命 ...
vue3生命周期钩子函数
vue2生命周期钩子函数视图 vue3生命周期钩子函数视图代码 // 通过配置项 beforeCreate () { console.log('beforeCreate'); }, created ...
Vue2.0 探索之路——生命周期和钩子函数的一些理解
前言在使用vue一个多礼拜后,感觉现在还停留在初级阶段,虽然知道怎么和后端做数据交互,但是对于mounted这个挂载还不是很清楚的.放大之,对vue的生命周期不甚了解.只知道简单的使用,而不知道为什 ...
vue生命周期和react生命周期对比。
生命周期指的是组件从初始化开始到结束的过程或者是生命周期是描述组件从开始到结束的过程,每个组件都具有生命周期,都对组件通过生命周期给予的钩子函数进行管理. 钩子函数指的是系统某些状态和参数发生改 ...
React新旧版本生命周期对比
React新旧版本生命周期对比 ❶ 过时生命周期: ① componentWillMount ② componentWillReceiveProps ③ componentWillUpdate ❷ 即 ...
React之新旧生命周期对比
<!DOCTYPE html> <html> <head> <meat charset="UTF-8"> <title> ...

vue2 与 vue3 生命周期对比

周期对比

用法

vue2 与 vue3 生命周期对比相关推荐

最新文章

热门文章