Dans mon application dactylographiée NextJS/React, j'utilise un setTimeout.

Il y a un bogue dans les applications React provoquant l'appel instantané de setTimeout, que j'ai ensuite trouvé un correctif dans cette réponse ici : ReactJS : setTimeout() ne fonctionne pas ?

Ci-dessous se trouve mon code, mais j'obtiens l'erreur dactylographiée suivante sur le this sur this.resetNotification

any 'this' a implicitement le type 'any' car il n'a pas de type annotation.ts(2683) Board.tsx(158, 7): Une valeur externe de 'this' est masquée par ce conteneur.

@bind
resetNotification(): any {
  console.log('resetNotification...');
  this.setState({ notificationClass: 'spin-in-notification' });
  this.props.setNotification('', false);
}

@bind
private handleNotificationClick() {
  this.setState({ notificationClass: 'slide-out-bck-top' });

  setTimeout(
    function() {
      this.resetNotification();
    }
    .bind(this),
    500
  );
}

enter image description here

3
Leon Gaban 14 mars 2019 à 01:34

2 réponses

Meilleure réponse

Faites-le avec la fonction flèche sur setTimeout pour les accessoires de parents héréditaires

setTimeout(
  () => {
  this.resetNotification();
  }......
7
Jordi Castillo 13 mars 2019 à 22:45

Si vous souhaitez toujours utiliser la syntaxe function () {}, vous pouvez passer this comme premier paramètre à la fonction, avec une annotation de type. Comme ça:

  setTimeout(
    function(this: Board) {
      this.resetNotification();
    }
    .bind(this),
    500
  );

Je suppose que puisque le fichier s'appelle Board.tsx, votre composant est <Board>. Sinon, modifiez l'annotation de type pour this.

4
Bruno Ely 13 mars 2019 à 22:43