https://github.com/zzarcon/react-observable-hook
Generic utility to get free updates from a RXJS observable using React hooks
https://github.com/zzarcon/react-observable-hook
hooks observable react react-hooks rxjs subscription updates usestate
Last synced: 4 months ago
JSON representation
Generic utility to get free updates from a RXJS observable using React hooks
- Host: GitHub
- URL: https://github.com/zzarcon/react-observable-hook
- Owner: zzarcon
- License: mit
- Created: 2018-11-05T06:07:48.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2018-12-17T15:21:32.000Z (almost 7 years ago)
- Last Synced: 2025-05-12T22:42:00.683Z (5 months ago)
- Topics: hooks, observable, react, react-hooks, rxjs, subscription, updates, usestate
- Language: TypeScript
- Homepage:
- Size: 141 KB
- Stars: 7
- Watchers: 2
- Forks: 2
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# react-observable-hook
> Syntax sugar for rxjs observables and React hooks
Generic utility to get free updates from a RXJS observable using React hooks.
## Install
```
$ yarn add react-observable-hook
```
## Usage
**full example**
```typescript
import useObservable from 'react-observable-hook'
import {ReplaySubject} from 'rxjs';
export interface Clock {
seconds: number;
}
const subject = new ReplaySubject(1);
setInterval(() => {
subject.next({seconds: new Date().getSeconds()});
}, 1000);
export default () => {
const clock = useObservable(subject);
return (
Seconds: {clock ? clock.seconds : 'loading...'}
)
}
```
**initial state**
```typescript
const clock = useObservable(subject, () => {seconds: new Date().getSeconds()});
```
## ⚠️ Warning ⚠️
You need to provide:
```json
"react": "^16.7.0-alpha.0",
"react-dom": "16.7.0-alpha.0"
```
## Author
[@zzarcon](https://twitter.com/zzarcon) 😜