zerotwo v0.3.4
Install
yarn add zerotwo
CDN: UNPKG | jsDelivr (available as window.zerotwo
)
Usage
Create a store
first:
import Vue from 'vue'
import zerotwo, { createStore } from 'zerotwo'
Vue.use(zerotwo)
const store = createStore({
state: { count: 0 },
mutations: {
increment: state => state.count++
}
})
new Vue({
store,
render: h => h(App)
})
Then create your App
:
import { connect, state, mutation } from 'zerotwo'
// A "stateless" component
const Counter = {
props: ['count', 'increment'],
template: `<button @click="increment">{{ count }}</button>`
}
// Connect needed state and mutations to `Counter`
const App = {
template: '<counter />',
components: {
Counter: connect({
count: state(),
increment: mutation()
}, Counter)
}
}
export default App
It's almost the same as Vuex
but here's no mapState
mapMutations
etc.. Instead you use connect
to feed any needed data to your component as props.
connect
import { state, getter, action, mutation } from 'zerotwo'
connect({
count: state(),
doubleCount: getter(),
increment: mutation(),
incrementAsync: action()
})
// To connect from a different name
// Just pass the name to the connect helpers like:
connect({
// state.thatCount -> this.count
count: state('thatCount')
})
createStore({ state, mutations, actions, getters, plugins })
state
Type: Function | object
Initial state.
mutations
Type: { [type: string]: Function }
Mutation handlers.
actions
Type: { [type: string]: Function }
Action handlers.
getters
Type: { [key: string]: Function }
Register getters on the store. The getter function receives the following arguments:
state,
getters
plugins
Type: Array<Function>
An array of plugin functions to be applied to the store. The plugin simply receives the store as the only argument and can either listen to mutations (for outbound data persistence, logging, or debugging) or dispatch mutations (for inbound data e.g. websockets or observables).
store
store.commit(mutation, payload)
store.dispatch(action, payload)
store.replaceState(newState)
License
MIT © EGOIST