Skip to content

Component HOC

Michael Niday edited this page Jun 6, 2018 · 4 revisions

The most basic usage of redux-capacitor is to wrap a default export with an HOC

import { entities } from 'entities'

class Component extends React.Component {
  renderItems = () => {
    const { collection } = this.props
    return collection.items.map(item => <p>{item.bar}</p>)
  }

  render () {
    return this.renderItems()
  }
}

export default entities({collection: {type: 'foo'}})(Component)

In the above, {type: 'contact'} would reference a record type called contact defined in records.js

By wrapping this component with the entities HOC, a prop called collection would be passed to Component.

Component has a number of attributes on it containing data and information about the state of the collection: More on that here: Container Props

Clone this wiki locally