Context

    在某些场景下，你想在整个组件树中传递数据，但却不想手动地在每一层传递属性。你可以直接在React中使用强大的context API解决上述问题。

    绝大多数的应用程序不需要使用context。

    如果你希望使用应用程序更加稳定就不要使用context。这只是一个实验性的API并且可能在未来的React版本中移除。

    如果你不熟悉或者Mobx这类state管理库，就不要使用context。对于许多应用程序，上述库和state绑定是管理state不错的选择。Redux相比context是更好的解决方法。

    如果你不是一个有经验的React开发者，就不要使用context。更好的方式是使用props和state。

    如何使用Context

    假定有下面的结构:

    在这个例子中，我们手动地传递color属性使得Button和Message设置正确的样式。使用，我们可以自动在组件树中传递属性。

    通过给MessageList添加childContextTypes和childContextTypes(context提供者)，React自动地向下传递信息，任何子树(例如:Button)可以通过定义contextTypes访问到属性。

    如果没有定义contextTypes,context将是一个空的object。

    Context可以构建API使得父组价和子组件进行相互通信。例如：工作机制如下:

    在你构建包含类似于上述的API的组件之前，考虑是否有其他的更清晰的选择。例如，你可以传递整个React组件作为props传递。

    在生命周期函数中使用Context

    如果contextTypes在组件中定义，下列的生命周期函数将接受一个额外的参数:context对象

    如果contextType被定义为函数的属性，无状态函数式组件也能够引用context。下面的代码演示了一个Button状态的函数式组件。

    更新Context

    别这么做！

    React有一个API更新context，但是它打破了基本流程，不应该使用。

    问题在于，组件提供的context值改变，后代元素如果shouldComponentUpdate返回false那么context的将不会更新。这使得使用context的组件完全失控，所以基本上没有办法可靠的更新。/how-to-safely-use-react-context-b7e343eff076">这篇blog很好的解释了为什么这是一个问题并如果绕过它。