chnl's Introduction

chnl

Implementation of event channels (aka pub/sub, dispatcher, emitter) inspired and compatible with Chrome extensions Events API.

Install

npm i chnl

Docs

https://vitalets.github.io/chnl

Usage

foo.js

import Channel from 'chnl';

// create channel
export const onData = new Channel();

// subscribe to channel
onData.addListener(data => console.log(data));

bar.js

import {onData} from './foo';

// dispatch event to channel
onData.dispatch({foo: 'bar'});

Adding/removing listeners in dispatching loop

Chnl makes a copy of the listeners before starting dispatching loop. So modifying listeners list (adding/removing) in dispatching loop will affect only the next dispatch:

const onData = new Channel();
const listener1 = () => console.log(1);
const listener2 = () => {
  console.log(2);
  onData.addListener(listener3);
};
const listener3 = () => console.log(3);
onData.addListener(listener1);
onData.addListener(listener2);

onData.dispatch();
// 1
// 2
onData.dispatch();
// 1
// 2
// 3

License

MIT @ Vitaliy Potapov

chnl's People

Contributors

Stargazers

Watchers

chnl's Issues

add ReactSubscription class to easily subscribe/unsubscribe react components in lyfecycle methods

Before:

class Button extends React.Component {
  constructor() {
    super();
    this.subscription = new Channel.Subscription([
      {channel: onNewData, listener: this.handleNewData.bind(this)}
    ]);
  }
  componentDidMount() {
    this.subscription.on();
  }
  componentWillUnmount() {
    this.subscription.off();
  }
}

After:

class Button extends React.Component {
  constructor() {
    super();
    new Channel.ReactSubscription(this, [
      {channel: onNewData, listener: this.handleNewData.bind(this)}
    ]);
  }
}

channel can not construct

index.d.ts is not compatible for most cases

[!] (plugin commonjs--resolver) RollupError: Unexpected token (Note that you need plugins to import files that are not JavaScript)
node_modules/chnl/types/index.d.ts (1:19)
1: import RealChannel = require('./channel');

Recommend Projects