Skip to content

Instantly share code, notes, and snippets.



Last active Jan 19, 2019
What would you like to do?
Renders React components conditionally e.g. <If exp={ true }></If> to avoid inline short-circuit evaluation/ternary hell
<If exp={ true }> components to render </If>
<If exp={ false }> components not to render </If>
import React from "react";
import PropTypes from "prop-types";
export default class If extends React.Component {
static propTypes = {
exp: PropTypes.any,
children: PropTypes.any
render() {
// JavaScript is an eagearly evaluated language, so even if th exp
const defer = () => this.props.children;
return this.props.exp ? defer() : null;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment