https://github.com/toplan/redux-on
Store enhancer for redux which support accurately subscribe
https://github.com/toplan/redux-on
enhancer redux redux-on subscribe
Last synced: about 2 months ago
JSON representation
Store enhancer for redux which support accurately subscribe
- Host: GitHub
- URL: https://github.com/toplan/redux-on
- Owner: toplan
- License: mit
- Created: 2017-04-27T09:55:45.000Z (about 8 years ago)
- Default Branch: master
- Last Pushed: 2017-05-02T14:49:11.000Z (about 8 years ago)
- Last Synced: 2025-02-06T14:27:10.261Z (3 months ago)
- Topics: enhancer, redux, redux-on, subscribe
- Language: JavaScript
- Size: 6.84 KB
- Stars: 3
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
redux-on
==============
[](https://travis-ci.org/toplan/redux-on)
[](https://www.npmjs.com/package/redux-on)
[](https://www.npmjs.com/package/redux-on)
Store enhancer for [redux](https://github.com/reactjs/redux) which support accurately subscribe.
## Install
```js
npm i --save redux-on
```
## Usage
```js
import { createStore, applyMiddleware, compose } from 'redux'
import accuratelySubscribe from 'redux-on'
const enhancer = compose(
applyMiddleware(...middleware),
accuratelySubscribe()
)
const store = createStore(reducer, initialState, enhancer)
// example
const off = store.on((prevState, state) => {
return prevState.user !== state.user
}, (prevState, state) => {
alert(`Hi, ${state.user.name}, welcome!`)
})
```
## Api
#### on([type], [predicate], handler, [once])
Adds a change handler. It will be called any time an action with specified type dispatched
or successful predication.
###### Arguments
1. `type` (String): The type of action.
2. `predicate` (Function): The logic of predication. It will be called with two parameters: `prevState`, `state`. Need to returns a boolean value.
3. `handler` (Function): The change handler. It will be called with two parameters: `prevState`, `state`.
4. `once` (Boolean): Whether to handle change only once. Default `false`.
###### Returns
(Function): A function that drop the change handler.
###### Examples
```js
// listen customer change by action type.
const off = store.on('CUSTOMER', (prevState, state) => {
alert(`Hi, ${state.customer.name}! welcome to the bar.`)
})
// listen customer change by predication.
const off1 = store.on(
(prevState, state) => prevState.customer !== state.customer,
(prevState, state) => alert(`Hi, ${state.customer.name}! welcome to the bar.`)
)
// listen customer change by action type and predication.
const off2 = store.on(
'CUSTOMER',
(prevState, state) => state.customer.age < 18,
(prevState, state) => alert(`Hey, boy! Can't drink!`)
)
// cancel listen
off()
```
#### once([type], [predicate], handler)
Adds a change handler. It will be called only once an action with specified type dispatched
or successful predication.
###### Arguments
1. `type` (String): The type of action.
2. `predicate` (Function): The logic of predication. It will be called with two parameters: `prevState`, `state`. Need to returns a boolean value.
3. `handler` (Function): The change handler. It will be called with two parameters: `prevState`, `state`.
###### Returns
(Function): A function that drop the change handler.
###### Examples
```js
store.once('CUSTOMER', (prevState, state) => {
alert(`Hey, you are the first customer, free drinking tonight!`)
})
// or
store.once(
(prevState, state) => !prevState.customer && state.customer,
(prevState, state) => alert(`Hey, you are the first customer, free drinking tonight!`)
)
```
## License
MIT