Exportation React composant avec plusieurs wrappers HOC?

Question

J'ai un composant React qui affiche du texte stylé et je veux qu'il charge une ressource réseau, écoute les entrées WebSocket et affiche les notifications. Pour ce faire, j'écris un composant d'ordre supérieur fonctions d'encapsuleur pour chacune d'entre elles: withResource, withSocket et withNotifications.

Lors de l'exportation du composant, est-ce correct?

class TextComponent extends React.Component {
  ...
}

export default withResource(withSocket(withNotifications(TextComponent)))

Answer 1

Vous pouvez utiliser compose à partir de redux ou recompose . Par exemple:

Redux

import { compose } from 'redux'

export default compose(
  withResource,
  withSocket,
  withNotifications
)(TextComponent)

Recomposer

import { compose } from 'recompose'

export default compose(
  withResource,
  withSocket,
  withNotifications
)(TextComponent)