0.0.3 • Published 7 years ago
mini-lake v0.0.3
Mini Lake
A small copy of waterfall to just to play around with the context API a little more.
Install
npm install mini-lakeUsage
This very simple stores gives you a Provider component, and a connect
function to wrap your components.
Providerreceives two propsinitialStateandactions.initalStateis an object representing the initial state of your App.actionsis an object representing the actions that affect said state, note that thisactionsmust be pure functions that receive the App's current state and returns a new object with the whole new state.
Counter Example
import React from 'react'
import { Provider, connect } from 'mini-lake'
const Counter = ({ count, addToCount }) => {
return (
<div>
<h1>{count}</h1>
<button onClick={addToCount}>Add!</button>
</div>
)
}
const ConnectedCounter = connect(Counter)
const initialState = { count: 0 }
const actions = { addToCount: state => ({ count: state.count + 1 }) }
export default App = () => {
return (
<Provider initalState={initialState} actions={actions}>
<Counter />
</Provider>
)
}Running the Tests
Download the repo and in the root folder run: npm test.