https://github.com/drawcall/RxEmitter
RxEmitter = 🐟Rxjs + 🐡eventBus.
https://github.com/drawcall/RxEmitter
emitter eventbus eventemitter observable rxjs
Last synced: 8 months ago
JSON representation
RxEmitter = 🐟Rxjs + 🐡eventBus.
- Host: GitHub
- URL: https://github.com/drawcall/RxEmitter
- Owner: drawcall
- Created: 2017-04-28T09:59:17.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2023-04-21T11:50:08.000Z (over 2 years ago)
- Last Synced: 2025-03-25T23:37:39.785Z (8 months ago)
- Topics: emitter, eventbus, eventemitter, observable, rxjs
- Language: TypeScript
- Homepage:
- Size: 226 KB
- Stars: 55
- Watchers: 6
- Forks: 5
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- my-awesome-list - RxEmitter
- awesome-state - RxEmitter
README
# RxEmitter
### RxEmitter = Rxjs + eventBus.
RxEmitter combines the characteristics of Rxjs and eventBus.Emit a Stream of similar events, and you can accept it in any where.
Use RxEmitter to make your project easy to decouple.
It can be used for angular,React,Vue and so on.
## Installation and Usage
### ES6 or TypeScript
##### Installation
```shell
npm install rxemitter
```
##### emit
```javascript
import { RxEmitter, toRxEmitter, rxEmit } from "rxemitter";
//...
/** emit */
Observable.from([1, 2, 3, 4])
.map((x) => x * 10)
.toRxEmitter("ADD_AN_NUMBER");
// or
Observable.of("hello world")
.rxEmit("ADD_NEW_WORD")
.subscribe((x) => x);
// or
RxEmitter.emit("EVENT_NAME", { a: 1, b: 2 });
```
##### on
```javascript
import { RxEmitter } from 'rxemitter';
//...
/** on */
RxEmitter.on('ADD_AN_NUMBER').subscribe(x=> console.log(`ADD A NEW NUMBER - ${x}`));
// or
@RxOn("ADD_AN_NUMBER")
value:Observable;
// or
@RxSubscribe("ADD_AN_NUMBER")
subscribe(value:number){
console.log(value);
}
```
##### Rxemitter can be used for Angular2+、React、Vue and so on.
## API Methods
#### RxEmitter.emit\(eventName: string, ...rest: T[]): string
> emit a global event , passing a stream
```javascript
RxEmitter.emit("HELLO_WORLD", myObj);
```
#### toRxEmitter\(this: Observable\, a: any, b?: any): Subscription
> RxEmitter.emit an Observable sequence.
```javascript
Observable.fromEvent(document, "click")
.interval(1000)
.toRxEmitter({ eventName: "MOUSE_CLICK", timeout: 10 });
// or
Observable.from([1, 2, 3, 4]).toRxEmitter({
eventName: "VALUE",
map: (x) => x + 10,
});
// or
Observable.from([1, 2, 3, 4]).toRxEmitter("CHANGE_EVENT");
```
#### rxEmit\(this: Observable\, a: any, b?: any): Observable\
> rxEmit an Observable sequence.
```js
Observable.fromEvent(document, "click")
.rxEmit({ eventName: "MOUSE_CLICK", log: true })
.subscribe((x) => x);
```
#### RxOn(a: string | Object, b: boolean | string = false, c: any = null)
> To attaches an event handlers, we can use the @RxOn decorator.
```js
@RxOn("HELLO_WORLD")
value:Observable;
```
#### RxSubscribe(a: string | Object, b: boolean | string = false, c: any = null)
> To attaches an event handlers and registration a listener handler, we can use the @RxSubscribe decorator.
```js
@RxSubscribe("HELLO_WORLD")
subscribe(value:number){
console.log(value);
}
```
#### RxEmitter.on\(eventName: string, target?: any): Observable
> attaches an event handlers
```js
RxEmitter.on("HELLO_WORLD")
.map((x) => x + 1)
.subscribe((x) => console.log(x));
```
#### RxEmitter.off(eventName: string): any
> remove all event handlers
```js
RxEmitter.off("HELLO_WORLD");
```
#### unsubscribe(target: any, eventName?: string)
> disposal the resources , target is your registration id
```js
RxEmitter.unsubscribe(this,"HELLO_WORLD");
```
#### offAllByTarget(target: any)
> remove id=target event handlers and disposal the resources.
```js
RxEmitter.offAllByTarget(this);
```
## Used in the angular
```js
import { RxOn } from 'rxemitter';
//
@RxOn("DATA_LOADED")
items$: Observable;
// in html
```
## Building
```shell
//build es6
npm run es6
//build commonjs
npm run cjs
//clone package
npm run package
//run all
npm run all
```