web-dev-qa-db-fra.com

Appeler une fonction statique dans la classe React ES6

J'ai la classe ReactJS suivante:

import React from 'react'

export class Content extends React.Component {

  static getValue(key) {
    return key
  }

  render() {
    let value = this.getValue(this.props.valueKey);
    return <span dangerouslySetInnerHTML={{__html: value}} />
  }
}

Mais j'ai l'erreur suivante:

TypeError: this.getValue is not a function

Je ne comprends pas. Est-ce le bon moyen d'appeler une fonction statique? Je pense que réagir fait quelque chose avec la statique, mais je ne sais pas quoi.

javascriptreactjsecmascript-6
38
Ajouve

Une méthode statique doit être accessible sur la classe et non sur une instance. Donc dans votre cas, utilisez:

Content.getValue()

Cependant, une méthode statique ne pourra pas accéder à this - Je ne pense pas que vous souhaitiez que la méthode soit statique en fonction de votre exemple de code ci-dessus.

Plus: Membres statiques dans ES6

46
Cymen

Vous pouvez y accéder depuis la classe en tant que this.constructor.getValue.

Edit: J'ai ajouté un JSFiddle ici . La seule modification apportée a été l'ajout de l'appel de fonction du constructeur et la suppression de l'innerHTML, qui est dangereusement défini. Comme indiqué, vous pouvez accéder à la statique getValue à partir de this.constructor et tout fonctionne parfaitement.

12
Geoffrey Abdallah