Live Demo
What does this library offer?
- Minimal: It is a tiny yet crucial library for creating React apps in a much more faster and safer way.
- Pure Abstraction: It is so abstract that it doesn't even depend on react module. That means you can use it in any script too.
- Fully Documented: The project is well documented and has comprehensive unit tests.
How to install? 📦
Since the package is in npm you can use the command below to add it to your project packages:
npm i react-event-dispatcher
How to use? 🚀
In your React file you have to import it in ES6 syntax:
Now you have full access to the library. Cheers! Let's try it with a basic example:
const eventToDispatch = consoleEventDispatcherEventDispatcher// You should see 'It really works 👌' on your console.
A Complete Example
// Written in Nodeconst EventDispatcherFactory =const myDispatcher = EventDispatcherFactory{thisupdateChildName = myDispatcher}// Assume that this._name is private{this_name = '@ChildComponent'// In React you don't need to bind// Just create a method in Component with arrow// function since it is already bound to thisconst updateName = {this_name = name}EventDispatcherFactory}{return this_name}const childComponent =const parentComponent =parentComponentconsole
# output{ name: '@AwesomeComponent' }
Motivation and Architecture
Motivation
I have been working on React quite lately. And one of the problems I had encountered a lot is event propagation between miscellaneous components. At some point it had been so cumbersome that I had to left some of the projects that I have been dedicated for. So I wrote this minimal yet efficient library for React.
Architecture
Since version 1.8.0
, the main architecture has been changed drastically. The architecture schema is like below:
Contributing
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change. Also you can help me to improve the library by joining my Gitter room and sharing your ideas about it.