介绍

vue3的生命周期函数,可以按需导入到组件中,且只能在 setup() 函数中使用

示例

import { onMounted, onUpdated } from '@vue/composition-api'

export default {
setup() {
onMounted(() => {
console.log('mounted')
})
onUpdated(() => {
console.log('updated')
})
}
}

对比vue2.x

  • beforeCreate -> 使用setup()
  • created -> 使用 setup()
  • beforeMount -> onBeforeMount
  • mounted -> onMounted
  • beforeUpdate -> onBeforeUpdate
  • updated -> onUpdated
  • beforeDestroy -> onBeforeUnmount
  • destroyed -> onUnmounted
  • errorCaptured -> onErrorCaptured

vue3生命周期的更多相关文章

  1. vue2和vue3生命周期的区别

    概念 首先,我们了解一下"生命周期"这个词.通俗的来说,生命周期就是一个事务从出生到消失的过程.例如,一个人从出生到去世.在vue中,vue的生命周期是指,从创建vue对象到销毁v ...

  2. Vue3 生命周期 && Hooks封装 && toRef

    1 # 一.Vue3.0与Vue2.0生命周期改动 2 beforDestroy改名为beforeUnmount 3 destroyed改名为unmounted 4 # Vue3.0页提供了Compo ...

  3. Vue3生命周期的理解

    beforeCreate():在实例生成之前 created():在实例生成之后 beforeMount():在模板已经被编译成函数之后,组件内容被渲染到页面之前 mounted():在组件内容被渲染 ...

  4. react组件的生命周期

    写在前面: 阅读了多遍文章之后,自己总结了一个.一遍加强记忆,和日后回顾. 一.实例化(初始化) var Button = React.createClass({ getInitialState: f ...

  5. 浅谈 Fragment 生命周期

    版权声明:本文为博主原创文章,未经博主允许不得转载. 微博:厉圣杰 源码:AndroidDemo/Fragment 文中如有纰漏,欢迎大家留言指出. Fragment 是在 Android 3.0 中 ...

  6. C# MVC 5 - 生命周期(应用程序生命周期&请求生命周期)

    本文是根据网上的文章总结的. 1.介绍 本文讨论ASP.Net MVC框架MVC的请求生命周期. MVC有两个生命周期,一为应用程序生命周期,二为请求生命周期. 2.应用程序生命周期 应用程序生命周期 ...

  7. UIViewController生命周期-完整版

    一.UIViewController 的生命周期 下面带 (NSObject)的方法是NSObject提供的方法.其他的都是UIViewController 提供的方法. load   (NSObje ...

  8. angular2系列教程(十一)路由嵌套、路由生命周期、matrix URL notation

    今天我们要讲的是ng2的路由的第二部分,包括路由嵌套.路由生命周期等知识点. 例子 例子仍然是上节课的例子:

  9. Spring中Bean的作用域、生命周期

                                   Bean的作用域.生命周期 Bean的作用域 Spring 3中为Bean定义了5中作用域,分别为singleton(单例).protot ...

随机推荐

  1. 微信小程序敏捷开发实战

    wxml->wcc编译->javascript 用户javascript-> wawebview->view 小程序原理 微信 小程序-> webview appserv ...

  2. Error:gradle-resources-test:thymeleaf-in-action.main: java.lang.NoClassDefFoundError: org/apache/tools/ant/util/ReaderInputStream

    目录 Error:gradle-resources-test:thymeleaf-in-action.main: java.lang.NoClassDefFoundError: org/apache/ ...

  3. P1270 “访问”美术馆——不太一样的树形DP

    P1270 “访问”美术馆 dfs读入,存图有点像线段树: 在枚举时间时,要减去走这条边的代价: #include<cstdio> #include<cstring> #inc ...

  4. 最大子段和(洛谷 P1115)

    题目描述 给出一段序列,选出其中连续且非空的一段使得这段和最大. 输入格式 第一行是一个正整数NNN,表示了序列的长度. 第二行包含NNN个绝对值不大于100001000010000的整数AiA_iA ...

  5. 第12组 Beta冲刺(4/5)

    Header 队名:To Be Done 组长博客 作业博客 团队项目进行情况 燃尽图(组内共享) 展示Git当日代码/文档签入记录(组内共享) 注: 由于GitHub的免费范围内对多人开发存在较多限 ...

  6. QML学习(三)——<QML命名规范>

    QML对象声明 QML对象特性一般使用下面的顺序进行构造: id 属性声明 信号声明 JavaScript函数 对象属性 子对象 状态 状态切换 为了获取更好的可读性,建议在不同部分之间添加一个空行. ...

  7. hadoop jps不显示信息

    使用kvm做了一个hadoop组件的镜像,使用该镜像启动,在使用jps的时候,没有任何信息显示. 解决: 删除/tmp下的hsper开头文件,哪个用户没有权限就删除对应的hsper**_usernam ...

  8. Spring AOP的实现记录操作日志

    适用场景: 记录接口方法的执行情况,记录相关状态到日志中. 注解类:LogTag.java package com.lichmama.spring.annotation; import java.la ...

  9. Gradle入门系列

    http://blog.jobbole.com/71999/ 版权声明:本文为博主原创文章,未经博主允许不得转载.

  10. 玩转@Git三剑客

    扫码时备注或说明中留下邮箱 付款后如未回复请至https://shop135452397.taobao.com/ 联系店主