- Create Components folder under src folder
- Add ToggleEXP.js file and add below Code
import React from "react";
class ToggleEXP extends React.Component {
constructor(props) {
super(props);
this.state = { isToggleOn: true };
}
handleClick = () => {
this.setState(prevState => ({
isToggleOn: !prevState.isToggleOn
}));
};
render() {
return (
<button onClick={this.handleClick}>
{this.state.isToggleOn ? "ON" : "OFF"}
</button>
);
}
}
export default ToggleEXP;
- Open App.js file and update code as below
import React from "react";
import ReactDOM from "react-dom";
import ToggleEXP from "./components/ToggleEXP";
function App() {
return (
<div className="App">
<ToggleEXP />
</div>
);
}
const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);
Output
No comments:
Post a Comment