| I think it makes more sense if you start thinking outside the Toggle component itself. For passing down the state to the actual button(s), as Kent says, you could just use React.Children.map(). When you think about consuming that state from other components that need to know the toggle state, things get a bit messier, as many of those components might not be direct children of the actual <Toggle />. Maybe the toggling affects something in your navbar, for example. In that case, the alternative to using context would be a global store, where the state provider sits above all components (think Redux, MobX). If you're only consuming the toggle state from child / grandchild / sibling etc. components, the alternative typically involves passing down the toggle state from some parent / grandparent component, which means passing this.state.toggled down 2+ levels, instead of simply importing the context's consumer and subscribing where needed. Context is now a reasonably simple and clean alternative to those options, but this example leaves envisioning the pain alleviated as an exercise for the reader. |