Skip to content

ReactJS based conditional rendering component with no external dependencies

License

Notifications You must be signed in to change notification settings

DigiThinkIT/bloom-conditionals

Repository files navigation

bloom-conditionals

Travis npm package Coveralls

A ReactJS conditional rendering higher order component.

Install

with npm

npm install bloom-conditionals

with yarn

yarn add bloom-conditionals

Usage

Simple static values test:

import { Condition, When, Else } from "bloom-conditionals";

const myComponent = (props) => {
    return <Condition test={props.someValue}>
        <When true>I am True</When>
        <When false>I am False</When>
        <Else>I render when no When or NotWhen renders</Else>
    </Condition>
}

Test specific values:

import { Condition, When, Else } from "bloom-conditionals";

const myComponent = (props) => {
    return <Condition test={props.someValue}>
        <When value={true}>I am True</When>
        <When value={false}>I am False</When>
        <Else>I render when no When or NotWhen renders</Else>
    </Condition>
}

Test using functions

import { Condition, When, Else } from "bloom-conditionals";

const myComponent = (props) => {
    return <Condition test={props.someValue}>
        <When value={v => v === true}>I am True</When>
        <When value={v => v === false}>I am False</When>
        <Else>I render when no When or NotWhen renders</Else>
    </Condition>
}

About

ReactJS based conditional rendering component with no external dependencies

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published