react-conditionally-render
TypeScript icon, indicating that this package has built-in type declarations

1.0.2 • Public • Published

Introduction

Readability is important, and conditional renders often introduce a complexity that make it difficult to follow what is going on. This component aims to solve that by creating a readable interface in the form of a react component

Usage

Simple usage:

import Profile from './Profile'
import AnonymousProfile from './AnonymousProfile'

<ConditionallyRender
  condition={loggedIn}
  show={<Profile />}
  elseShow={<AnonymousProfile />}
/>

Usage with functions:

import Profile from './Profile'
import AnonymousProfile from './AnonymousProfile'

const renderProfile = () => {
 return <Profile />
}

const renderAnonymousProfile = () => {
    return <AnonymousProfile />
}

<ConditionallyRender
  condition={loggedIn}
  show={renderProfile}
  elseShow={renderAnonymousProfile}
/>

Readme

Keywords

none

Package Sidebar

Install

npm i react-conditionally-render

Weekly Downloads

7,647

Version

1.0.2

License

ISC

Unpacked Size

5.82 kB

Total Files

12

Last publish

Collaborators

  • foseberg