当前位置: 首页 > news >正文

vue3父子组件、跨级组件之间的通信之provide, inject -- 通俗易懂

当组件之间的跨度比较大时,用父子孙之间的通信需要层层传递,不优雅,也不方便传值和更新。

此方法适用于父子组件之间、爷孙组件之间的通信且高效。

父组件:

孙组件:

 

 此处本组件触发点击事件后,count的数据会增加,爷组件中的响应式数据state也会发生改变,也会跟着增加。

子组件:

父组件:

另外,父组件中如果爷添加点击事件触发改变state.count,那么子孙组件中通过inject接收的响应式数据count也会跟着自减。

 

 以上就是组件之间通过provide、inject的方式通信,是不是很方便。

http://www.lryc.cn/news/352027.html

相关文章:

  • input输入多行文本,保存为.dot文件和对应的.txt文件
  • 如何让社区版IDEA变得好用
  • Hsql每日一题 | day02
  • RepOptimizer原理与代码解析(ICLR 2023)
  • 持续总结中!2024年面试必问 20 道 Redis面试题(六)
  • 【通义千问—Qwen-Agent系列2】案例分析(图像理解图文生成Agent||多模态助手|| 基于ReAct范式的数据分析Agent)
  • 10G SFP双口万兆以太网控制器,高速光口网络接口卡
  • [前端|vue] 验证器validator使用笔记 (笔记)
  • 欢乐钓鱼大师攻略大全,游戏自动辅助,钓鱼大全!
  • Prompt - 流行的10个框架
  • PYQT5点击Button执行多次问题解决方案(亲测)
  • 华为编程题目(实时更新)
  • AI巨头争相与Reddit合作:为何一个古老的论坛成为AI训练的“宝藏”?
  • Mysql和Postgresql创建用户和授权命令
  • 以及Spring中为什么会出现IOC容器?@Autowired和@Resource注解?
  • nss刷题(3)
  • Qt编译和使用freetype矢量字库方法
  • Java interface 接口
  • 深入理解MySQL:查询表的历史操作记录
  • 【Centos7+JDK1.8】Jenkins安装手册
  • SpringBootWeb 篇-深入了解 Mybatis 概念、数据库连接池、环境配置和 Lombok 工具包
  • JAVA开发 基于最长公共子序列来计算两个字符串之间的重复率
  • Android HAL到Framework
  • Python数据可视化(七)
  • StringMVC
  • 前端基础入门三大核心之HTML篇 —— SVG的viewBox、width和height:绘制矢量图的魔法比例尺【含代码示例】
  • Java-Zookeeper
  • Godot游戏引擎有哪些优势
  • 一张图看懂大模型性价比:能力、价格、并发量全面PK
  • 设计井字棋游戏(一)