Switch-case React component to render nested components.
Install with npm:
npm install --save react-switch-case-renderimport { Switch, Case, Default } from 'react-switch-case-render';
function Example({ expression }) {
const type = 'show';
return (
<Switch expression={type}>
<Case value="show">show</Case>
<Case value="add">add</Case>
<Case value="edit">edit</Case>
<Default>nothing to show.</Default>
</Switch>
);
}The <Switch /> components provide an expression, matching the expression's value against a series of <Case /> components, and render <Case /> children after the first <Case /> with a matching value.
| Prop | Type |
|---|---|
| expression | string/number/boolean/null/undefined |
| children | React.ReactNode |
provide an value used to match against expression. if the expression matches the value, the children will be render.
| Prop | Type |
|---|---|
| value | string/number/boolean/null/undefined |
| children | React.ReactNode |
if the value of expression doesn't match any of the <Case /> value, the children will be render.
| Prop | Type |
|---|---|
| children | React.ReactNode |