🍭 redux-candy
IMPORTANT: This project maybe useful for development or toy but maybe not for produciton.
Generate redux updeep based reducer and actions.
Installation
$ npm install redux-candy
$ yarn add redux-candy
Example
const initialState = counter: 0const reducer = // counterconst increment = const decrement = const Counter = { return <div> <div>counter</div> <button onClick= >increment</button> <button onClick= >decrement</button> </div> } const CounterContainer = Counterconst store = const App = <Provider store=store> <CounterContainer /> </Provider>
You can show real demo and example source
Usage
redux-candy provide very stupid reducer that apply passed action.
const initialState = counter: 0const reducer =
And you must pass action that has update function
// counterconst increment = const decrement =
You can pass plain action like this.
const increment = { type: 'INCREMENT' payload: // [key]: updateFunction i + 1 }
If you want replace value
const replaceValueAction = // orconst replaceValueAction = { type: 'INCREMENT' payload: // [key]: updateFunction someValue: value }
You can mutate oldValue
const listItemAppendAction = )// orconst listItemAppendAction = { type: 'INCREMENT' payload: // [key]: updateFunction ...oldList value }
You can pass nested property.
const actionCreator = const action = // orconst action = type: 'SOME_TYPE' payload: a: b: c: 'value' )
You can pass key-value action.
const actionCreator = const action =
API
Reducer
createReducer(initialState: Object, [actionFilter: Function])
Generate updeep based rootReducer.
This reducer accept all action and return updeep(action.payload, state)
.
This reducer ignore below action too.
- Not flux standard action.
- Non object type payload action.
- Ignore action example:
{ type:"TYPE", payload: "someValue" }
- Ignore action example:
If you want controll update condition, pass actionFilter
const updateCondition = { // update when pass SOME_ACTION return actiontype === "SOME_ACTION"}
Action
Helper for create action for redux-candy reducer. This actionCreator return FSA compatible action.
createAction(actionType: String, targetProperty: String, [updateFunction: Function], [metaCreator: Function])
Generate update targetProperty value action.
const actionCreator = // const initialState = { bob: 1 }store)// state:// {// bob: 11 // 1 + 10// }
updateFunction
get arguments (baseValue, ...inputs)
.
All action arguments pass to updateFunction
. You can use that.
const actionCreator =
createAction(actionType: String, targetProperties: Array, [updateFunction: Function], [metaCreator: Function])
Generate update targetProperty value action.
// const initialState = { users: { bob: 1 } }const complexActionCreator = store)// state:// {// users: {// bob: 11// }// }
createAction(actionType: String, updateFunction: Function, [metaCreator: Function])
Proxy redux-action
You can fully control payload.
// const initialState = { bob: 1 }const complexActionCreator = store)// state:// {// bob: 11// } store)// state:// {// bob: 1,// sam: 10// }