Utiliser 'ref' sur React Styled Components ne fonctionne pas

Question

J'ai du mal à utiliser refs avec les composants stylisés. Lorsque j'essaie d'y accéder dans mes méthodes de classe comme ci-dessous, j'obtiens l'erreur suivante:

Edit.js: 42 UnCaught TypeError: this ..... contains n'est pas une fonction

  constructor(props) {
    ....
    this.setWrapperRef = this.setWrapperRef.bind(this);
    this.handleClickOutside = this.handleClickOutside.bind(this);
   }
----------
  setWrapperRef = (node) => {
    this.wrapperRef = node;
  }
  handleEdit = (e) => {
    e.preventDefault();
    this.props.onEdit(this.props.id, this.state.title);
  }
----------
<Wrapper onSubmit={this.handleEdit} ref={this.setWrapperRef}>
  ...
</Wrapper>

J'ai trouvé le code de cette question

Qu'est-ce que je fais mal ici?

Answer 1

J'ai trouvé la réponse moi-même. La solution consiste à utiliser innerRef au lieu de ref car le ref lui-même pointe vers le composant stylé et non le nœud DOM.

Une discussion détaillée peut être trouvée sur GitHub