simple-events-stream

A lightweight package for triggering callbacks to registered callbacks

Usage no npm install needed!

<script type="module">
  import simpleEventsStream from 'https://cdn.skypack.dev/simple-events-stream';
</script>

README

React Native - Simple Events Stream

Overview

While not technically only a React Native Package, it was built specifically for the need to have a very simple & lightweight method to register various parts of our React Native Application for callbacks when events were fired.

Simplicity

While the package is simple, it doesn't have protection built-in so it should only be used for the most basic of needs.

API

  1. on(eventID, listenerID, callback): When you want to listen for an event you can register a callback using "on" and passing the event you want to listen to, an ID for removing in the future, and a callback function.
  2. trigger(eventID, eventData): Trigger an event using the "trigger" function.
  3. remove(eventID, listenerID): Remove an ID on the given event so it won't receive callbacks anymore.
  4. removeAll(eventID): Remove all registered callbacks on a given eventID.

Example

First Component (Listener 1)

var Events = require('react-native-simple-events');
var React = require('react-native');

let {
  Text
} = React;

var ListenComponent = React.createClass({

    componentDidMount() { Events.on('Ready', 'myID', this.onReady) },
    
    componentWillUnmount() { Events.rm('Ready', 'myID') },
    
    onReady: (data) => { console.log('--- onReady Triggered ---'); console.log(data) },
    
    render() { return <Text> Listener Component 1 </Text> },

});

module.exports = ListenComponent;

Second Component (Trigger)

var Events = require('react-native-simple-events');
var React = require('react-native');
let {
  TouchableOpacity
} = React;
var TriggerComponent = React.createClass({

    triggerEvent() { Events.trigger('Ready', {my: 'data'}) },
    
    render() {
        return <TouchableOpacity onPress={() => this.triggerEvent()}> Press Me To Emit Event! </TouchableOpacity>;
    },

});

module.exports = TriggerComponent;