React-23:React兄弟组件直接通信的方法(消息订阅-发布机制)

简介: React-23:React兄弟组件直接通信的方法(消息订阅-发布机制)

1:安装pubsub-js

npm install pubsub-js

2:引入pubsub库

import PubSub from 'pubsub-js';

3:发布消息

image.png

4:订阅消息

image.png

相关文章
|
4月前
|
资源调度 前端开发 JavaScript
React 的antd-mobile 组件库,嵌套路由
React 的antd-mobile 组件库,嵌套路由
45 0
|
13天前
|
前端开发
【专栏】在 create-react-app 中集成 less/sass 预处理器和 react-css-modules 的方法
【4月更文挑战第29天】本文介绍了在 create-react-app 中集成 less/sass 预处理器和 react-css-modules 的方法。首先,通过 `npm` 安装 less 或 sass 依赖,然后修改 `config-overrides.js` 配置文件以支持 less/sass 编译。接着,详细阐述如何使用 less/sass 编写样式。再者,安装 react-css-modules 并配置 webpack,使能样式模块化。最后,展示了如何结合使用 less/sass 和 react-css-modules,以提升前端开发的效率和代码质量。
|
19天前
|
存储 人工智能 开发框架
【AI大模型应用开发】【AutoGPT系列】0. AutoGPT概念及原理介绍 - Agent开发框架及ReAct方法
【AI大模型应用开发】【AutoGPT系列】0. AutoGPT概念及原理介绍 - Agent开发框架及ReAct方法
23 0
|
1月前
|
前端开发 JavaScript
React生命周期方法在实际开发中的应用场景有哪些?
【4月更文挑战第6天】 React 生命周期方法应用于数据获取、订阅管理、渲染逻辑处理、用户交互响应、性能优化、资源清理、强制更新、错误处理、动画实现、代码分割、服务端渲染、路由处理、依赖注入和集成第三方库。它们帮助控制组件行为和性能,但现代开发推荐使用Hooks替代部分生命周期方法。
16 0
|
3月前
|
JavaScript 前端开发 开发者
vue和react的运行机制
vue和react的运行机制
15 2
|
3月前
|
前端开发 中间件 数据安全/隐私保护
React路由进阶方法
React路由进阶方法
28 1
|
3月前
|
存储 前端开发 中间件
React组件间的通信
React组件间的通信
18 1
|
3月前
|
前端开发 应用服务中间件 数据库
react服务端组件
react服务端组件
21 0
|
3月前
|
前端开发 JavaScript
快速上手React:从概述到组件与事件处理
快速上手React:从概述到组件与事件处理
|
4月前
|
前端开发 JavaScript API
React组件生命周期
React组件生命周期
76 1