Skip to content

Instantly share code, notes, and snippets.

View NAPOLEON039's full-sized avatar

Nihar Raote NAPOLEON039

View GitHub Profile

In the previous article, we looked at what Context is and how to pass values with it. In this article we will look at updating the Context value from the child component. For our theme example this means clicking the button will now switch the theme between light and dark.

Updating Context value

In the previous article, we directly passed the theme via the Provider component. Although the value is passed to ThemeButton.js and ThemeWindow.js components, we cannot update this value.

To switch between the two theme types, we need to pass a function as well. This function will allow us to switch between both themes.

So we need to pass this function along with the dark theme via the Provider component. To do this, we can create a stateful object which will contain both the theme and a function. This way React can keep track of the theme and perform the necessary re-renders when it updates.

![Creating a stateful obje