js-event-listener v1.0.10

This package suitable for react, react-native or javascript projects. The source written in javascript without any dependencies.

Why

Certain situations can make our development as difficult like updates the redux state by returning a new state every time which can cause excessive use of memory, pass down in component three the event as a prop or communication between independent components for example can be bypassed with event listener.

Instalation

npm install --save js-event-listener

Usage Example

The event listener also work across different files in react, react-native or javascript apps. All you have to do is import the appropriate function into any file you need and receive or send event. Check Live Example

import React,{ useEffect } from 'react'; 
import { addEventListener, emitEvent, removeEventListener } from 'js-event-listener';

export default function App() {

  useEffect( () => {
    let id = addEventListener("customEvent", (e) => {
      console.log(e);
    });
    return () => {
      removeEventListener(id);
    }
  },[]);

  let clickEventHandler = () => emitEvent("customEvent", "my first event!");

  return (
    <div className="App">
      <button onClick={clickEventHandler}>Event submit</button>
    </div>
  );
}

API Details

// Functions

import { addEventListener, emitEvent, removeEventListener, removeAllEventListener } from 'js-event-listener';

addEventListener(eventName, callback); // create event.
emitEvent(eventType, data); // emit event.
removeEventListener(eventType); // remove spesific event by eventType or id.
removeAllEventListener(); // remove all events.

// Short version

import { on, emit, rm, rmAll } from 'js-event-listener';

on(eventName, callback); // create event.
emit(eventType, data); // emit event.
rm(eventType); // remove spesific event by eventType or id.
rmAll(); // remove all events.

Params.

Functions.