https://github.com/hodev-dev/react-logic-components
using JSX as Logic
https://github.com/hodev-dev/react-logic-components
component jsx jsx-renderer react react-native reactive reactjs redux
Last synced: 4 days ago
JSON representation
using JSX as Logic
- Host: GitHub
- URL: https://github.com/hodev-dev/react-logic-components
- Owner: hodev-dev
- Created: 2020-08-18T09:23:21.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2020-08-19T06:50:36.000Z (over 5 years ago)
- Last Synced: 2025-12-29T07:23:37.050Z (4 months ago)
- Topics: component, jsx, jsx-renderer, react, react-native, reactive, reactjs, redux
- Language: TypeScript
- Homepage:
- Size: 343 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# React Logic Components
# install
**no need to use npm** just copy `src/Logics` folder drop into react project because it has `Zero` dependecy
## IF Component
render jsx if variable and check return `` base on given logic otherwise return ``
if there is no `` return null
```js
import IF, { THEN, ELSE } from './Logics/IF';
```
```html
do something
do something else
```
# SWITCH Component
render if case equal to variable if didn't find any case it will render default
```js
import SWITCH, { CASE, DEFAULT } from './Logics/Switch';
```
```html
render ali
render reza
render if no casee found
```
# FOREACH Component
map over data and inject each data `as` props with given name into component
```js
import FOREACH from './Logics/ForEach';
```
```html
```
# Performance
there may be some performance overhead but i didn't notice anything noticable because react is slow by default on render more than 100 element at same time and it considered to be bad practice (virtualized list) for less than that it should be fine