首页 > 其他分享 >父组件监听到子组件的生命周期

父组件监听到子组件的生命周期

时间:2022-10-25 16:14:31浏览次数:36  
标签:... 到子 vue 钩子 组件 mounted 监听

一、问题引入

父组件监听到子组件的生命周期

二、$emit手动触发

// Parent.vue
<Child @mounted="doSomething"/>
    
// Child.vue
mounted() {
  this.$emit("mounted");
}

三、@hook钩子

//  Parent.vue
<Child @hook:mounted="doSomething" ></Child>

doSomething() {
   console.log('父组件监听到 mounted 钩子函数 ...');
},
    
//  Child.vue
mounted(){
   console.log('子组件触发 mounted 钩子函数 ...');
},    
    
// 以上输出顺序为:
// 子组件触发 mounted 钩子函数 ...
// 父组件监听到 mounted 钩子函数 ...     

 

标签:...,到子,vue,钩子,组件,mounted,监听
From: https://www.cnblogs.com/younghxp/p/16825195.html

相关文章

  • React进阶篇——二、组件与服务器通信
    二、组件与服务器通信1,组件挂载阶段通信componentDidMount是调用服务器API最安全的地方,也是React官方推荐的进行服务器通信的地方。除了在componentDidMount,在componentW......
  • 从0搭建vue3组件库: 如何完整搭建一个前端脚手架?
    相信大家在前端开发中都使用过很多前端脚手架,如vue-cli,create-vite,create-vue等;本篇文章将会为大家详细介绍这些前端脚手架是如何实现的,并且从零实现一个create-kitty脚手......
  • Vue.js 异步组件传参
    本文主要展示一下如何给异步组件进行参数传递:通过h函数就可以啦versions:[email protected] 子组件Async.vue<template><div><span>异步注册组件:</sp......
  • JavaScript学习--事件监听
    事件绑定方式一:通过HTML标签中的事件属性进行绑定<inputtype="button"onclick='on()'>functionon(){alert("我被点了");} 方式二:通过DOM元素属性绑定<inputty......
  • Oracle动态监听及静态监听区别
    作者:IT邦德中国DBA联盟(ACDU)成员,目前从事DBA及程序编程(Web\java\Python)工作,主要服务于生产制造现拥有Oracle11gOCP/OCM、Mysql、Oceanbase(OBCA)认证分布式TBase\TDSQL数......
  • Mybatis原理分析-核心组件
    Mybatis四大对象指的是:Executor,StatementHandler,ParameterHandler和ResultSetHandler对象。四个对象在SqlSession内部共同协作完成sql语句的执行,同时也是我们自定义插件拦......
  • 如何用界面组件DevExpress WinForm创建一个支持High DPI的应用?
    DevExpressWinForm拥有180+组件和UI库,能为WindowsForms平台创建具有影响力的业务解决方案。DevExpressWinForms能完美构建流畅、美观且易于使用的应用程序,无论是Office......
  • Jenkins pipeline 如何到子文件中去执行命令
    如果需要在Jenkins的子文件夹中执行命令,我们不能使用cd的方式来进入子文件夹。而是需要在steps中定义Dir如下面的配置:stage('BuildVUE'){......
  • 仿制element-ui按钮组件(一)
    这里我想做一个按钮组件的页面,左边放置按钮组件,右边是按钮组件的属性选择下拉框。我可以选为按钮定义的属性,然后在左边的按钮上面体现。这里我遇到一个问题,如上图,element......
  • Oracle故障案例 | 19C动态监听无法注册实例的处理
    文章目录​​前言​​​​⛳️1.故障现象​​​​⛳️2.故障排查​​​​✨2.1尝试添加静态监听​​​​✨2.1排查local_listener​​​​⛳️3.故障处理​​​​⛳️4.技能......