vue3【生命周期讲解-详】
创始人
2024-01-23 06:51:20
0次
一、通过配置项的形式使用生命周期钩子
父组件：
子组件test:
当前求和为：{{sum}}
刚进来刷新就会触发，以下四个生命周期：
点击加1，就会触发，是否更新的生命周期
隐藏之后就会触发卸载的钩子：
当再次点击显示，就会从创建前开始加载
注意：我们现在用的是vue3，我们可以利用vue3组合式api的形式去使用生命周期。既然用组合式api ，需要再setup里面定义。
上面我们已经验证了，vue3中可以继续使用vue2的生命周期钩子。
【vue3中最重要的生命周期变化如下】
beforeCreate和created等价于setup，所以当使用配置项去写生命周期的时候，这两个钩子可以和setup共存，当我们将他们放入setup中时，在vue3中并没有提供对应的组合式api，使用时会报错。因为他们认为setup就相当于beforeCreate，不可共存
剩余的钩子函数，都需要在原来的基础上加上一个on ，代表当...时候
二、组合式api使用生命周期钩子
既然是组合式api，那么在setup中使用的时候就需要引入。先引入后组合~
他们都是一个函数。并可以传递一个回调函数
测试一下：
一进来打印：
点击加1，更新
点击隐藏，卸载
点击显示，从头开始。
三、【有人说，我想组合式和配置项式同时共存（不建议），那我们看一下，会是什么结果。】
共存之后发现，带on的钩子优先级更高。
因此：组合式api里面写的生命周期钩子执行的时机要比配置项的执行时机快一点，实际开发中选择其中一种方式即可，完全不建议两个共存。
相关内容
热门资讯
官高爵显的近义词
官高爵显的近义词有：高官显爵，官高爵显[guān gāo jué xiǎn]的意思：爵：爵位，官爵；...
切要关头的近义词
切要关头的近义词有：紧要关头，切要关头[qiè yào guān tóu]的意思：关头：关口。比喻有...
面面俱到,面面俱到的意思,面...
面面俱到miàn miàn jù dào [释义]俱：都。各方面都照顾到。也指虽然各方面都照顾...
人单势孤的近义词
人单势孤的近义词有：势单力薄，人单势孤[rén dān shì gū]的意思：人数少，力量单薄。出自...
间断的近义词
一、【近义词】 中断、中止、拆开、休止 二、【基本解释】 [释义](动)(连续的事情)中间...
乡壁虚造的近义词
乡壁虚造的近义词有：凭空捏造，无中生有，面壁虚构，乡壁虚造[xiāng bì xū zào]的意思：...
盎盂相敲的近义词
盎盂相敲的近义词有：盎盂相击，盎盂相敲[àng yú xiāng qiāo]的意思：比喻一家人争吵。...
高枕而卧的近义词
高枕而卧的近义词有：无忧无虑，高枕安卧，高枕安寝，高枕无忧，高枕而卧[gāo zhěn ér wò]...
破题儿第一遭的近义词
破题儿第一遭的近义词有：破题儿，破题儿头一遭，破题儿第一遭[pò tí ér dì yī zāo]的...
如堕烟海的近义词
如堕烟海的近义词有：如坐云雾，如堕烟雾，雾里看花，如堕烟海[rú duò yān hǎi]的意思：好...
雁杳鱼沉的近义词
雁杳鱼沉的近义词有：信断音绝，雁断鱼沉，雁逝鱼沉，雁杳鱼沉[yàn yǎo yú chén]的意思：...
汪洋大海的近义词
汪洋大海的近义词有：东洋大海，声势浩大，波澜壮阔，汪洋大海[wāng yáng dà hǎi]的意思...
明效大验的近义词
明效大验的近义词有：明验大效，明效大验[míng xiào dà yà]的意思：显著而又巨大的效验。...
难乎为继的近义词
难乎为继的近义词有：难以为继，难乎为继[nán hū wéi jì]的意思：难于继续下去。出自：清 ...
在所难免的近义词
在所难免的近义词有：在劫难逃，在所不免，在所无免，在所难免[zài suǒ nán miǎn]的意思...
恨入心髓的近义词
恨入心髓的近义词有：恨之入骨，恨之切骨，恨入骨髓，恨入心髓[hèn rù xīn suǐ]的意思：恨...
富翁的近义词
富翁的近义词 近义词： 大亨、财主 大亨：大亨 dàhēng[magnate;big wig;...
背本就末的近义词
背本就末的近义词有：背本趋末，背本逐末，背本就末[bèi běn jiù mò]的意思：指背离根本，...
问牛知马的近义词
问牛知马的近义词有：举一反三，触类旁通，问羊知马，闻一知十，问牛知马[wèn niú zhī mǎ]...
不通文墨的近义词
不通文墨的近义词有：不识之无，胸无点墨，不通文墨[bù tōng wén mò]的意思：通：精通；文...