JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 30
  • Score
    100M100P100Q57477F
  • License MIT

Middleware which allows listening actions of Context and Redux

Package Exports

  • react-action-listener

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-action-listener) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-action-listener

Version License: MIT

Middleware which allows listening actions of Context and Redux

Usages

replacement of redux-saga

// 1. Register middleware
import { createMiddleware, addListener } from 'react-action-listener';

const listener = createMiddleware();
const store = createStore(reduce, {}, applyMiddleware(listener()));

// 2. register listener
listener.addListener((dispatch, action) => {
  // Now you can listen 'ADD' when button is pressed.
  // {"type":"ADD","payload":1}
  console.log(`${JSON.stringify(action)}`);
});

const onClickPlus = () => {
  // When button is clicked an action 'ADD' is dispatched.
  dispatch({ type: 'ADD', payload: 1 });
};

return <button onClick={onClickPlus}>add</button>;

hook

// 1. Register middleware
import { createMiddleware, useActionListener } from 'react-action-listener';

const store = createStore(reduce, {}, applyMiddleware(createMiddleware()));

// 2. use hook
useActionListener('ADD', (dispatch, action) => {
  // Now you can listen 'ADD' when button is pressed.
  // {"type":"ADD","payload":1}
  console.log(`${JSON.stringify(action)}`);
});

const onClickPlus = () => {
  // When button is clicked an action 'ADD' is dispatched.
  dispatch({ type: 'ADD', payload: 1 });
};

return <button onClick={onClickPlus}>add</button>;

Install

npm i react-action-listener

Run tests

npm test

🤝 Contributing

Contributions, issues and feature requests are welcome!

Feel free to check issues page. You can also take a look at the contributing guide.

Show your support

Give a ⭐️ if this project helped you!

Author

👤 Jeong Hoon Park

Contributors


📝 License

Copyright © 2021 Jeong Hoon Park.

This project is MIT licensed.


This README was generated with ❤️ by readme-md-generator