Storeon Choo
A tiny connector for Storeon and Choo.
Size is only 81 bytes (minified and gzipped). It uses Size Limit to control size.
Read more about Storeon article.
Install
npm install -S storeon-choo
or
yarn add storeon-choo
How to use (Demo)
Create store using storeon
module:
store.js
import { createStoreon } from 'storeon'
let counter = store => {
store.on('@init', () => ({ count: 0 }))
store.on('inc', ({ count }) => ({ count: count + 1 }))
}
export const store = createStoreon([counter])
index.js
Use storeonMiddleware
from storeon-choo
.
import choo from 'choo'
import storeonMiddleware from 'storeon-choo'
import { store } from './store'
const app = choo()
app.use(storeonMiddleware(store))
app.route('/', require('./views/main'))
module.exports = app.mount('body')
Emitting @dispatch
event with payload (like [event, data]
) you will dispatch storeon
event. All states are located in state.storeon
property.
main.js
import html from 'choo/html'
export default function view(state, emit) {
const increment = () => emit('@dispatch', ['inc'])
return html`
<body>
<h1>Count: ${state.storeon.count}</h1>
<button onclick=${increment}></button>
</body>
`
}