美文网首页
react 组件间通信的几种方式

react 组件间通信的几种方式

作者: hk_faith | 来源:发表于2020-03-03 11:41 被阅读0次

通过 props 传递

1,共同是数据放在父组件上,特有的数据放在自己的组件的内部(state),
2,通过 props 可以传递一般的数据和函数数据,只能一层一层传递
3,一般数据--》父组件传递给子组件--》子组件读取数据
4,函数数据--》子组件传递给父组件--》子组件调用函数

通过消息的发布订阅模式-PubSubJS

参考:
https://github.com/mroderick/PubSubJS
使用:

npm install pubsub-js --save

import Pubsub from 'pubsub-js'
//发布
Pubsub.publish("topic",data)
//订阅
Pubsub.subscribe("topic", (msg, data) => {
    console.log(msg, data);
})

通过 redux

Redux 是 JavaScript 状态容器,提供可预测化的状态管理
中文文档:http://cn.redux.js.org/

相关文章

  • react 组件间通信的几种方式

    通过 props 传递 1,共同是数据放在父组件上,特有的数据放在自己的组件的内部(state),2,通过 pro...

  • React 中组件间通信的几种方式

    在使用 React 的过程中,不可避免的需要组件间进行消息传递(通信),组件间通信大体有下面几种情况: 父组件向子...

  • react通信

    通信的几种方式 一般来说,react里边有几种常用的方式:父到子,子到父,兄弟组件之间的通信。 ===== 父向子...

  • React 中组件间通信的几种方式

    1、父组件向子组件通信父组件通过向子组件传递 props,子组件得到 props 后进行相应的处理 2、子组件向父...

  • React组件通信的几种方式--TypeScript

    React组件通信的几种方式--TypeScript 通过todoList示例进行学习,首先创建基于TypeScr...

  • 07-02-React 类组件

    目标 掌握类组件的定义和使用; 掌握 React 组件间通信的方式; 掌握类组件的生命周期。 内容 在 React...

  • Flutter|常用数据通信组件

    在做需求时经常会遇到组件间通信,本篇汇总了几种常用的通信方式。 父子组件之间的通信 最简单的方式就是通过构造器传递...

  • React组件通信的几种方式

    需要组件之进行通信的几种情况 父组件向子组件通信 子组件向父组件通信 跨级组件通信 没有嵌套关系组件之间的通信 1...

  • Vue组件通信的几种方式【转】

    Vue组件通信的几种方式【转】 组件通信主要有以下几种方式:props,$emit和$on,vuex,$attrs...

  • React Native 的组件通信方式

    React Native 的组件通信方式 React Native 的...

网友评论

      本文标题:react 组件间通信的几种方式

      本文链接:https://www.haomeiwen.com/subject/qchqlhtx.html