- Olny 0.4kb(gzip) - Only 4 Core API: - CreateObserver - useObserver - Consumer - next - Use typescript
npm install gewu-ob- Olny 0.4kb(gzip)
- Only 4 Core API:
- CreateObserver
- useObserver
- Consumer
- next
- Use typescript
``sh`
$ npm install --save react-ob
`js
import { CreateObserver, UseObserver } from "gewu-ob";
const data = CreateObserver({ age: 5, text: "hello" });
const Button = () => {
// only update when s.age change
const { age } = useObserver(data, (s) => [s.age]);
return (
onClick={() => {
data.next((s) => {
s.age += 1;
});
}}
>
add num
);
};
const Input = () => {
// only update when s.text change
const { text } = useObserver(data, (s) => [s.text]);
return (
Use Consumer style
`js
import { CreateObserver, Consumer } from "gewu-ob";const data = CreateObserver({ text: "please input" });
export default () => {
return (
[s.text]} render={(s) => {s.text}} />
placeholder="inputA..."
onInput={(e) => {
data.next((s) => {
s.text = e.currentTarget.value;
});
}}
/>
);
};
``