react-beep
v2.0.4
Published
New way for state management without connect component
Downloads
22
Readme
react-beep
New way for state management without connect component
install
npm install react-beep
use
Initial state
import { initial } from 'react-beep';
initial([
{
name: 'time',
defaultValue: 2018
}
]);
Connect to components
import React, { PureComponent } from 'react';
import { state, Beep } from 'react-beep';
class DisplayTime extends Beep(['time'], PureComponent) {
render() {
return <div>{state.time}</div>;
}
}
Change state
import { state } from 'react-beep';
state.time = 2019;
Advance
import { initial } from 'react-beep';
initial([
{
name: 'time',
defaultValue: 2018,
shouldUpdate: (prevValue, nextValue) => nextValue > prevValue,
willUpdate: (prevValue, nextValue) => console.log(prevValue, nextValue),
didUpdate: value => console.log(value)
}
]);
API
Listen to the changes
import { on } from 'react-beep';
on('time', value => {
console.log('change time:', value);
});
Init single state
import { init } from 'react-beep';
init({
name: 'time',
defaultValue: 2018
});
Other way for change state
if time
is not inited, emit just send message to the listener
import { emit } from 'react-beep';
emit('time', 2020);
Migration from v1 to v2
You should pass React.PureComponent
or React.Component
as second argument.
- class DisplayTime extends Beep(['time']) {
+ class DisplayTime extends Beep(['time'], PureComponent)