Communication components react

communication components react, mainly divided into the following cases

A parent-child assembly, The props father to son, the parent child callback pass

1. Down transfer

Parent component subassembly to the traditional values, by propspassing

Parent component to component grandchildren, great-grandchildren, and so have a direct or indirect relationships invoked components by value, or by propsthe layers passed on, but after this level will not find too many propsdata sources.

2. Passed up

Sub-assemblies to the parent component by value, by way of a callback function, parent component by first propspassed to a function sub-assemblies, subassemblies, call this function, nature or through propsdelivery.

Grandchildren, great-grandchildren component is passed up the layers above call.

Second, there is no communication component nesting relationship

1. To find a common parent component, an intermediate component to a value transfer
2. Event publish - subscribe model

The entire project to create a common Event object, the object's properties and methods can be invoked globally.

Three, redux, Mobx and other global state management library

Four, react16 new context API

We can get through context directly from the ancestor component values, without the need for transfer layers.

Similar new contextAPI with redux usage.

Reproduced in: https: //juejin.im/post/5d08b6746fb9a07f021a02fb