Loader/Spinner Library for React
Create your spinner/Loader
npm i react-spinner-animated
<BarLoader/><DoubleBubble><SlidingPebbles/><DoubleOrbit/><Spinner/><HalfMalf/><TripleMaze/>
You must import both the Loader/Spinner component and index.css
i.e - import 'react-spinner-animated/dist/index.css'
import { BarLoader,DoubleBubble, SlidingPebbles }
from 'react-spinner-animated';
import 'react-spinner-animated/dist/index.css'
class MyComponent extends Component {
render() {
return <DoubleOrbit text={"Loading..."} bgColor={"#F0A500"}
center={false} width={"150px"} height={"150px"}/>
}
}| Prop | Usage | Default | Type |
|---|---|---|---|
| text | Custom text for display with the loader/spinner | " " | Strings |
| bgColor | Custom text for display with the loader/spinner | White | Any color name or HEX color code |
| width | width of the container | - | pixels (150px) |
| height | height of the container | - | pixels (150px) |
| center | Place the component fixed at the center of the page | true | Boolean (true, false) |
MIT © venushadilshan