reactbeginnermit
React Toggle Switch
A controlled toggle switch component.
8.5k1.9k1.3k401
About this module
A clean controlled toggle with optional label, disabled state and proper `role=switch` semantics.
#react#toggle#switch#controlled
Source code
Installation
- 1
Install dependencies
Install React and the required packages.
npm install react react-dom - 2
Create the component
Create ReactToggleSwitch.tsx and paste the source below.
- 3
Create the styles
Create `styles.css` alongside the component and import it from the component file.
- 4
Import and use
Import the component in your page or layout and render it.
Usage
- 1
Import the component
Import ReactToggleSwitch from its file.
import ReactToggleSwitch from "./components/ReactToggleSwitch"; - 2
Render it
Render the component in your JSX.
export default function App() { return <ReactToggleSwitch />; }