1.0.2 • Published 2 years ago
react-toggle-peiss v1.0.2
0. image
1.you can install to type to terminal.
npm i react-toggle-peiss
npm start
2.just import this top of your code.
import ReactToggle from "react-toggle-peiss"
3.and then you can use like this
<ReactToggle
setToggleState={false}
onToggle={(boolean)=>console.log(boolean)}
containerWidth={"44px"}
containerHeight={"24px"}
containerBG={"#61be82"}
buttonWidth={"16px"}
buttonHeight={"16px"}
buttonBG={"#fafafa"}
buttonMove={"24px"}
/>
3-1.real code sample
import React from 'react'
import ReactToggle from "react-toggle-peiss"
const ToggleTest = () => {
return (
<div>
<ReactToggle
setToggleState={false}
onToggle={(boolean)=>console.log(boolean)}
containerWidth={"44px"}
containerHeight={"24px"}
containerBG={"#61be82"}
buttonWidth={"16px"}
buttonHeight={"16px"}
buttonBG={"#fafafa"}
buttonMove={"24px"}
/>
</div>
)
}
export default ToggleTest
4. this is thte param description
setToggleState: current state value
onToggle: you can set the event or catch the param inside when you toggled
containerWidth: width of toggle container
containerHeight: height of toggle container
containerBG: background color of toggle container
buttonWidth: width of toggle button
buttonHeight: height of toggle button
buttonBG: background color of toggle background
buttonMove: put inside the length that can move from your left side