0
votes

Typescript + React.lazy

const Game = React.lazy(() => new Promise( (resolve) => {
    setTimeout( () => resolve(import('./Game')) , 1000)
}))
Error : Error:(6, 35) TS2345: Argument of type 'Promise<typeof import("D:/PROGECTS/SnakeReactReduxTS/snake-react-redux-ts/src/Components/Stages/Game")>' is not assignable to parameter of type '{ default: never; } | PromiseLike<{ default: never; }> | undefined'.
Type 'Promise<typeof import("D:/PROGECTS/SnakeReactReduxTS/snake-react-redux-ts/src/Components/Stages/Game")>' is not assignable to type 'PromiseLike<{ default: never; }>'.
Types of property 'then' are incompatible.
Type '<TResult1 = typeof import("D:/PROGECTS/SnakeReactReduxTS/snake-react-redux-ts/src/Components/Stages/Game"), TResult2 = never>(onfulfilled?: ((value: typeof import("D:/PROGECTS/SnakeReactReduxTS/snake-react-redux-ts/src/Components/Stages/Game")) => TResult1 | PromiseLike<...>) | null | undefined, onrejected?: ((reaso...' is not assignable to type '<TResult1 = { default: never; }, TResult2 = never>(onfulfilled?: ((value: { default: never; }) => TResult1 | PromiseLike) | null | undefined, onrejected?: ((reason: any) => TResult2 | PromiseLike<...>) | null | undefined) => PromiseLike<...>'.
Types of parameters 'onfulfilled' and 'onfulfilled' are incompatible.
Types of parameters 'value' and 'value' are incompatible.
Property 'default' is missing in type 'typeof import("D:/PROGECTS/SnakeReactReduxTS/snake-react-redux-ts/src/Components/Stages/Game")' but required in type '{ default: never; }'.What does he want from me?

javascript reactjs typescript

2 commentaires

Bonjour, donnez-nous plus d'informations sur ce que tu vas faire? Quels efforts avez-vous fait et quel est le problème à faire face? Et, s'il vous plaît, s'il vous plaît, faites le journal d'erreur facile à lire

Je veux faire simuler le retard. Le code fonctionne bien sur JS, je veux juste le tyran

3 Réponses :

0
votes

    const Game = React.lazy(() => import('./Game'))
You have try this

1 commentaires

Je veux faire simuler le retard

1
votes

Que veut-il de moi? P>
Que voulez-vous de lui? p>
réact.lazy code> doit être utilisé comme celui-ci: P>
const Game = React.lazy(() => import('./Game'));

2 commentaires

Je veux faire simuler le retard

Cette réponse ne répond pas à la question initiale; Voir @solanki ... ci-dessous pour une réponse qui fonctionne correctement avec Typescript.

1
votes

paresseux code> La fonction renvoie une promesse de {Par défaut: ...} objet appelé asynchrone et attendre code> Jusqu'à ce que la promesse ne soit pas résolue que daid retardé pour 1000 ms code> et à la fin, il importera le composant code> code> et le renvoyera.

    const Game = React.lazy(async () => {
      await new Promise(resolve => setTimeout(resolve, 1000));
      return import('./Game');
    });

2 commentaires

Typescript jure. J'ai besoin de le tyran

Fonctionne pour moi magnifiquement à TypeScript et est également facile à lire dans sa séquence, donc un exemple où async / attendre peut améliorer la lisibilité.