Vue中如何通过祖先组件调用后代组件的方法?

2026-04-02 20:590阅读0评论SEO资源
  • 内容介绍
  • 文章标签
  • 相关推荐

本文共计707个文字,预计阅读时间需要3分钟。

Vue中如何通过祖先组件调用后代组件的方法?

目录

一、首先

二、在组件事件中的祖先组件方法内

三、后代组件

(不限于后代,即任何组件)

四、一定要在接收的组件中卸载时销毁掉

vue3 中 provide 与 inject 祖先与后代组件

目录
  • 一、首先
  • 二、在触发事件的的祖先组件方法内 
  • 三、后代组件(不限于后代,就是任何组件)接受传参
  • 四、一定要在接收的组件销毁钩子里卸载掉
  • vue3 中“provide 与 inject“祖与后代组件间通信
    • 一、其他CompositionAPI
      • 1.provide与inject

前言:最近写代码遇到一问题:祖先级别的组件怎么操作孙子的儿子的组件方法(是不是已经绕晕了),在网上搜了半天都是父子传参,父子操作,晕晕乎乎的想起了bus(事件总线),

原理就是:是在vue原型上挂载(生命周期为实例创建之前beforcreate),通过这个实例里的事件派发和事件监听实现跨组件通信,设计模式叫做观察者模式(vue上就有$on,$emit 、$off)。

阅读全文

本文共计707个文字,预计阅读时间需要3分钟。

Vue中如何通过祖先组件调用后代组件的方法?

目录

一、首先

二、在组件事件中的祖先组件方法内

三、后代组件

(不限于后代,即任何组件)

四、一定要在接收的组件中卸载时销毁掉

vue3 中 provide 与 inject 祖先与后代组件

目录
  • 一、首先
  • 二、在触发事件的的祖先组件方法内 
  • 三、后代组件(不限于后代,就是任何组件)接受传参
  • 四、一定要在接收的组件销毁钩子里卸载掉
  • vue3 中“provide 与 inject“祖与后代组件间通信
    • 一、其他CompositionAPI
      • 1.provide与inject

前言:最近写代码遇到一问题:祖先级别的组件怎么操作孙子的儿子的组件方法(是不是已经绕晕了),在网上搜了半天都是父子传参,父子操作,晕晕乎乎的想起了bus(事件总线),

原理就是:是在vue原型上挂载(生命周期为实例创建之前beforcreate),通过这个实例里的事件派发和事件监听实现跨组件通信,设计模式叫做观察者模式(vue上就有$on,$emit 、$off)。

阅读全文