2
votes

Utilisation de setInterval () dans Typescript React

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
    }

    // ...


0 commentaires

3 Réponses :



4
votes

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.


2 commentaires

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.



0
votes

Si vous en avez défini un, cela devrait fonctionner.

private timerID: any;


1 commentaires

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.