Foreword
ContextIs translated into context, in the programming area, which is often exposed to a concept, React in there.
In the official documentation React, Contextare classified as part of the Advanced (Advanced), is an advanced API React, but the official did not recommend the use of Context in a stable version of the App.
The vast majority of applications do not need to use content.
If you want your application to be stable, don't use context. It is an experimental API and it is likely to break in future releases of React.
However, this does not mean we do not need attention Context. In fact, many of the best React components to complete their function by Context, such as the react-redux <Provider />, is through Contexta global state store, drag and drop components react-dnd, by Contextdistributing the DOM Drag and Drop events in the assembly, routing component by react-router Contextmanages the routing state like. React component in the development, if good Context, can make your components become powerful, and flexible.
Today you want to chat, I was in development, recognized this Context, and how I use it for component development.
Note: this article refers are mentioned in all App end Web App.
Acquaintance React Context
The official definition for Context
React document on the official website did not Contextgive "what is" is defined, more descriptive use of Contextscenarios, and how to use Context.
The official website for the use Contextof the scene described it this way:
In Some Cases, you want to pass data through the component tree without having to pass the props down manuallys at every level. you can do this directly in React with the powerful "context" API.
It simply is, when you do not want in the component tree by layer by layer transfer propsor statewhen to pass data mode can be used Contextto achieve the level of cross-component data transfer.
Use props or state data transfer, data from the top downstream.
Use Context, data transfer across the components.
Reference: https://www.jianshu.com/p/eba2b76b290b
Official website: https://react-1251415695.cos-website.ap-chengdu.myqcloud.com/docs/context.html