react子组件向父组件通信

最近在整理了一下长满灰的尘印象笔记，发现之前摘录的一篇文章：）

React 是以组合组件的形式组织的，组件因为彼此是相互独立的，从传递信息的内容上看，

几乎所有类型的信息都可以实现传递，例如字符串、数组、对象、方法或自定义组件等。所以，

在嵌套关系上，就会有 3 种不同的可能性：父组件向子组件通信（最常见的方式）、子组件向父组件通信和没有嵌套关系的组件之间通信。

---

在用 React 之前的组件开发模式时，常常需要接收组件运行时的状态，这时我们常用的方法

有以下两种。

1、利用回调函数：这是 JavaScript 灵活方便之处，这样就可以拿到运行时状态。

2、 利用自定义事件机制：这种方法更通用，使用也更广泛。设计组件时，考虑加入事件机

制往往可以达到简化组件 API 的目的。

在 React 中，子组件向父组件通信可以使用上面的任意一种方法，但在这种简单的场景下利

用自定义事件显然过于复杂，为了达到目的，一般会选择较为简单的方法。

例子如下：现在有app.jsx、list.jsx和 listItem.jsx三个组件，

list.jsx和 listItem.jsx组件分别如下，并要求勾选动作触发后把选中的项暴露出来

在上述例子中，我们在 List 组件中构造了 handleItemChange 方法，这样在使用 List 组件时，

就可以在运行时拿到改变的项对应的值。比如：