How React.js Toggle Button Works

In this blog, I will be explaining how a toggle works in React and how to create a toggle button to display plain text.

1. The Set Up

Let’s create a React component class called HideText

Import class component into App.js file (App.js file is where the all component will be imported to)

2. Adding attribute name to a component

React elements can take arguments called props so we are going to add an attribute name text to the HideText component

<HideText text="Hello World!" />

Now text prop will be available in the component within the object called this.props in the constructor method

3. Rendering the text prop in HideText class…