Skip to content
This repository has been archived by the owner on Sep 10, 2022. It is now read-only.

withReducer() and flattenProps()

Compare
Choose a tag to compare
@acdlite acdlite released this 09 Oct 20:58
· 619 commits to master since this release

withReducer()

withReducer<T, U>(
  stateName: string,
  dispatchName, string,
  reducer: (state: T, action: U) => T,
  initialState: T,
  BaseComponent: Class<ReactComponent>
): Class<ReactComponent>

Similar to withState(), but state updates are applied using a reducer function. A reducer is a function that receives a state and an action, and returns a new state.

Passes two additional props to the base component: a state value, and a dispatch method. The dispatch method sends an action to the reducer, and the new state is applied.

This allows enables you to use Redux-style reducer logic at the component-level.

flattenProp()

renameProps(
  propName: string,
  baseComponent: Class<ReactComponent>
): Class<ReactComponent>

Flattens an prop so that its fields are spread out into the props object.

const Abc = compose(
  withProps({
    object: { a: 'a', b: 'b' },
    c: 'c'
  }),
  flattenProp('object')
)(BaseComponent);

// Base component receives props: { a: 'a', b: 'b', c: 'c' }

This can be useful when using withState() or withReducer() and your state value is an object.