https://github.com/sergeysova/effector-debounce
Debounce effector units
https://github.com/sergeysova/effector-debounce
debounce effector
Last synced: 10 months ago
JSON representation
Debounce effector units
- Host: GitHub
- URL: https://github.com/sergeysova/effector-debounce
- Owner: sergeysova
- Archived: true
- Created: 2020-02-17T17:38:55.000Z (about 6 years ago)
- Default Branch: master
- Last Pushed: 2020-06-18T12:56:01.000Z (over 5 years ago)
- Last Synced: 2024-02-11T15:55:00.851Z (about 2 years ago)
- Topics: debounce, effector
- Language: TypeScript
- Homepage: https://npmjs.com/effector-debounce
- Size: 139 KB
- Stars: 5
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Effector Debounce
[](https://bundlephobia.com/result?p=effector-debounce)
> **Deprecated**: Use [patronum](github.com/sergeysova/patronum) instead
https://codesandbox.io/s/effector-throttle-debounce-w32tk
## Installation
```bash
npm install --save effector effector-debounce
# or
yarn add effector effector-debounce
```
## Usage
Create event that should be debounced:
```ts
import { createEvent } from 'effector';
const someHappened = createEvent();
```
Create debounced event from it:
```ts
import { createDebounce } from 'effector-debounce';
const DEBOUNCE_TIMEOUT_IN_MS = 200;
const debounced = createDebounce(someHappened, DEBOUNCE_TIMEOUT_IN_MS);
```
To test that original event is correctly debounced you can add watcher:
```ts
debounced.watch((payload) => {
console.info('someHappened now', payload);
});
someHappened(1);
someHappened(2);
someHappened(3);
someHappened(4);
// someHappened now 4
```
Also you can use `Effect` and `Store` as trigger. `createDebounce` always returns `Event`:
```ts
const event = createEvent();
const debouncedEvent: Event = createDebounce(event, 100);
const fx = createEffect();
const debouncedEffect: Event = createDebounce(fx, 100);
const $store = createStore(0);
const debouncedStore: Event = createDebounce($store, 100);
```
### Change name
```ts
const trigger = createEvent();
const debounced = createDebounce(trigger, 100);
// Now debounced var has `triggerDebounceTick` name
```
To change name:
```ts
const trigger = createEvent();
const debounced = createDebounce(trigger, 100, { name: 'Hello' });
// Now debounced var has `HelloDebounceTick` name
```