reactoggles
Higher-order components for React to enable toggling of components
Usage
To have a component selectively render, use ToggleOn:
{ /* toggling logic here */}const ToggledComponent = ; { return <ToggledComponent /> }
To render one of two components, use ToggleAB. The first component passed to ToggleAB will render if the function returns a truthy value, the second if it returns falsey.
{ /* toggling logic here */}const ToggledComponent = ; { return <ToggledComponent /> }
As with any higher-order components, any props passed to ToggledComponent
in these examples will be passed unchanged to the component that ends up rendering (if any). This allows for completely transparent operation if you want to do, for example:
Button = ; { return /* Other content... */ <Button className='button-join' text='Join Us!' /> }