1.0.1 • Published 3 years ago
maru-js v1.0.1
Maru.js
A minimal state management library for React
Features
- global state management with few codes.
- easily fetch data and sync to state
- ESLint supported with eslint-plugin-maru
Installation
npm i --save maru-js
or using yarn,
yarn add maru-js
useMaruInit - initialize states from root component
useMaruInit({key: value})
// App.tsx
import { useMaruInit } from "maru-js";
const App = () => {
useMaruInit({ count: 0, inputValue: "" });
return (
<div>
<CounterA />
<CounterB />
<Input />
</div>
);
};
useMaru - use state globally
[state, setState] = useMaru<T>(key: string)
import { useMaru } from "maru-js";
const CounterA = () => {
const [count, setCount] = useMaru("count");
return (
<button type="button" onClick={() => setCount(count + 1)}>
A: {count}
</button>
);
};
const Input = () => {
// pass type parameter 'number' to get correct type for the return value.
const [inputValue, setInputValue] = useMaru<string>("inputValue");
return (
<input
type="text"
value={inputValue}
onChange={({ target }) => setInputValue(target.value)}
/>
);
};
useMaruUpdater - easily fetch data and update state
useMaruUpdater(key: string, updater: () => Promise<T>, dependencies: any[])
import { useMaru, useMaruUpdater } from "maru-js";
// define async fetcher function
const fetcher = async (id: number) => {
const res = await fetch(`https://maru-api-test.com/count/${id}`);
const { count } = await res.json();
return count;
};
const CounterA = () => {
const [id, setId] = useMaru("id");
const [count, setCount] = useMaru("count");
// updater is re-called if dependency changes
useMaruUpdater("count", () => fetcher(id), [id]);
return (
<button type="button" onClick={() => setId(id + 1)}>
A: {count}
</button>
);
};
1.0.1
3 years ago
1.0.0
3 years ago
0.11.0
3 years ago
0.10.1
3 years ago
0.12.0
3 years ago
0.13.0
3 years ago
0.13.1
3 years ago
0.10.2-beta.0
3 years ago
0.10.0
3 years ago
0.10.0-beta.0
3 years ago
0.9.0
3 years ago
0.9.0-beta.0
3 years ago
0.8.1
3 years ago
0.8.0
3 years ago
0.7.1
3 years ago
0.7.0
3 years ago
0.6.0
3 years ago
0.5.0
3 years ago
0.5.0-beta.3
3 years ago
0.5.0-beta.2
3 years ago
0.5.0-beta.1
3 years ago
0.5.0-beta.0
3 years ago
0.4.1
3 years ago
0.4.0
3 years ago
0.3.3
3 years ago
0.3.2
3 years ago
0.3.1
3 years ago
0.3.0
3 years ago
0.2.1
3 years ago