2020-08-28 React context API

https://ibaslogic.com/react-context-api/


1. start by creating a context object :

                const TodosContext = React.createContext();

2. Once you have this context object, you have access to two components - the Provider and the Consumer.

                -> The React Context Provider allows all the component in the tree to have access to consume the context value. But not until you wrap the components that need access to this data or their common parent with it

3. HOW we can access/consume the context value from any of the child components.

3.1  access the context data in a class component.

             -> initializing the contextType using the static class, then assign it to the context object we created earlier;

3.2 Accessing the context data in a Function (Stateless) Component

                -> use the Consumer component to access the Context data within a function component            

                    -> requires a function as a child, which accepts a "value" argument.This "value" holds all the context object assigned to the value prop of the Provider.

https://www.freecodecamp.org/news/react-context-in-5-minutes/

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。