Last active
December 19, 2019 09:00
-
-
Save ilyalesik/34269fd4b8849e3d9b525c30708ca42c to your computer and use it in GitHub Desktop.
Storeon vs Effector
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {createStore, createEvent} from 'effector' | |
const inc = createEvent(); | |
const countStore = createStore(0); | |
countStore.on(inc, (store, count) => store + count); | |
import {useStore} from 'effector/react' | |
export default const Counter = () => { | |
const count = useStore(countStore) | |
return <button onClick={inc}>{count}</button> | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import createStore from 'storeon' | |
let increment = store => { | |
store.on('@init', () => ({ count: 0 })) | |
store.on('inc', ({ count }) => ({ count: count + 1 })) | |
} | |
export const store = createStore([increment]) | |
import useStoreon from 'storeon/react' // or storeon/preact | |
export default const Counter = () => { | |
const { dispatch, count } = useStoreon('count') | |
return <button onClick={() => dispatch('inc')}>{count}</button> | |
} | |
import StoreContext from 'storeon/react/context' | |
render( | |
<StoreContext.Provider value={store}> | |
<Counter /> | |
</StoreContext.Provider>, | |
document.body | |
) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment