React组件传值的方法

react之间的组件传值

我又来了haha(￣▽￣)／

关于react组件之间的传值

1.首先是父子组件最基础的传值(举一个todulist的例子)

• 父传子 采用props的格式
  我们拿这个datas
  
  在父组件里引入的子组件上进行传值
  

  子组件中采用this.props.xx的方式获取
  

  效果：
  

• 子传父 通过在父组件引入的子组件中传递一个函数并传参，子组件去触发这个函数更改参数完成数据更新

  - 父组件
  

    - 子组件 

这就行了！
查看删除效果 这样我们就把煮饺子干掉了

2.接下来介绍一款插件，pubsub 这个可以采用发布订阅的方式实现组件间的传值

 这里拿一个github搜索用户的小实例
 
 下载引入pubsub并在其中一个组件中发布

前者是键名，后者是键值
在另一个组件中通过pubsub.subscribe订阅

拿到数据就可以做后续一系列操作  我这里是一个页面发送搜索内容 一个页面收到搜索内容并通过axios请求搜索内容找到当前github用户

效果：搜索github用户

3.通过redux或者react-redux的方式进行各个页面的数据传递，就不用我说了吧？

4.通过上下文的形式做组件传值
这里以react hooks配合函数组件做例子
从react中引入
创建上下文

在父组件引入子组件的地方采用你刚才创建的上下文.Provider 通过value=传递数据

最后 在你子组件里用就好啦

以上，是我目前分享的一些react中组件传值的方法 献丑辽....