0.3.0 • Published 6 years ago
jsx-plus v0.3.0
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 |