Pass Data Between React Components with the useContext Hook

InstructorChris Achard

Share this video with your friends

Send Tweet

React hooks provide a new way to access the data and functions stored in context with the useContext hook.

In this lesson, we'll create a login form and store the user data in a context called UserContext that we create the typical way - with React.createContext(). We'll also provide that context to our app the typical way - by wrapping our app with <UserContext.Provider>.

But then, in our child components, we'll use useContext to pull out the value stored in the UserContext. Then, we can display that value, and use the function that we set in the context to change the user value.