jsx-plus

if/else/switch/case for jsx

Usage

import React from 'react';

import { IF, ELSE, SWITCH, CASE } from 'jsx-plus';

class Component extends React.Component {

  render(){
  
    let value = 2;
    
    return (
      <div>
      
        <IF test={value > 0}>
          value is greater than 0
          <ELSE/>
          value is equal or lesser than 0
        </IF>

        <SWITCH match={value}>
          <CASE test={0}>value is equal 0</CASE>
          <CASE test={1}>value is equal 1</CASE>
          <CASE test={2}>value is equal 2</CASE>
          {/* other children components without CASE is default */}
          unknown value
        </SWITCH>
        
      </div>
    );
  }

}

Components

IF

Property	Type	Description
test	any	condition for test
tag	string	default 'div'
id	string
className	string
style	object

ELSE

no props

SWITCH

Property	Type	Description
match	any	value to match
tag	string	default 'div'
id	string
className	string
style	object

CASE

Property	Type	Description
test	any	value to match