J'essaye de convertir une minuterie basée sur React exemple à Typescript.
La classe ressemble un peu à ceci:
private timerID: number | undefined; Type 'Timeout' is not assignable to type 'number'.
Dans componentWillUnmount ()
this.timerID
a une erreur:
[ts] Argument de type 'Timeout | undefined 'n'est pas attribuable à paramètre de type 'nombre | indéfini'. Le type «Timeout» n'est pas attribuable au type «nombre». [2345]
J'ai vérifié index.d.ts
, qui déclare clearInterval()
:
declare function clearInterval(intervalId: NodeJS.Timeout): void;
Il semble donc que je passe un argument correctement tapé dans clearInterval () et pourtant il attend un nombre. Que dois-je transmettre s'il vous plaît?
Edit: si je change ma déclaration timerID alors une erreur apparaît dans this.timerID
dans componentDidMount ()
:
export class Container extends Component<IProps, IState> { private timerID: NodeJS.Timeout | undefined; // stops a warning in DidMount constructor(props: IRevovlingContainerProps) { super(props); this.state = { date: new Date() } as any; } componentDidMount() { this.timerID = setInterval( () => this.tick(), 1000 ); } componentWillUnmount() { clearInterval(this.timerID); // error here on this.timerID } // ...
3 Réponses :
React utilise la vanille setInterval de JavaScript, qui renvoie un nombre. Vérifiez setInterval sur MDN
Cependant, le type de retour auquel vous faites référence, NodeJS.Timeout, est celui renvoyé par SetInterval du nœud . C'est spécifique à Node.js.
"Cet objet est créé en interne et est renvoyé par setTimeout () et setInterval ()" < / a>
Le délai d'expiration ne peut pas être attribué à un nombre signifie que vous déclarez le type attendu comme Délai d'expiration du nœud et que ce qui est réellement reçu est un nombre.
NodeJS.Timeout
est destiné à être utilisé lorsque vous exécutez dans l'environnement node
. Puisque vous souhaitez utiliser les API de navigateur, vous devrez utiliser numéro
comme type pour le timerID
.
De plus, les fonctions intégrées ne doivent pas résoudre leurs types à partir des définitions de type node
, dans votre cas. Si @ types / node
est installé, veuillez le désinstaller s'il n'est pas nécessaire. Cela peut être en conflit avec les types que vous devez utiliser.
Cela l'a merci! Les gens utilisent-ils les deux types de saisie? Si oui, comment font-ils?
Je pense que vous pourriez avoir besoin de différents tsconfig
s. Je ne suis pas sûr cependant.
Si vous en avez défini un, cela devrait fonctionner.
private timerID: any;
Bienvenue à SO. Cette question est assez ancienne et a déjà une réponse acceptée. Pensez à ajouter des détails sur les raisons pour lesquelles cela fonctionne ou à montrer pourquoi votre réponse est une bonne (meilleure?) Alternative.