0.1.0 • Published 2 years ago
redumb v0.1.0
Redumb
A simple rather dumb way to manage your global and local states in React.
How to use
import redumb from "./redumb";
const useData1 = redumb();
const useData2 = redumb();
const Counter1 = () => {
const [{ $color, count }, setData] = useData1({ count: 0 });
return (
<div className="counter">
<button onClick={() => setData('$color', $color === 'red' ? 'blue' : 'red')}>Change Color</button>
<button onClick={() => setData('count', count + 1)}>Add number</button>
<span style={{ color: $color }}>{count}</span>
</div>
);
}
const Counter2 = () => {
const [{ $color, count }, setData] = useData2({ count: 0, $color: 'red' });
return (
<div className="counter">
<button onClick={() => setData('$color', $color === 'red' ? 'blue' : 'red')}>Change Color</button>
<button onClick={() => setData('count', count + 1)}>Add number</button>
<span style={{ color: $color }}>{count}</span>
</div>
);
}
function App() {
return (
<div className="App">
<Counter1 />
<Counter2 />
</div>
);
}
export default App;
0.1.0
2 years ago