javascript - TypeScript + React.Lazy

标签 javascript reactjs typescript

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

错误:错误:(6, 35) TS2345:'Promise' 类型的参数不可分配给类型为“{ default: never; } | PromiseLike<{ 默认值:从不; }> |不明确的'。 类型 'Promise' 不可分配给类型 'PromiseLike<{ default: never; }>'。 “then”的属性类型是不兼容的。 输入 '(onfulfilled?: ((value: typeof import("D:/PROGECTS/SnakeReactReduxTS/snake-react-redux-ts/src/Components/Stages/Game")) => TResult1 | PromiseLike<...>) | null | undefined, onrejected?: ((reaso... ' 不可分配给类型 '(onfulfilled?: ((value: { default: never; }) => TResult1 | PromiseLike) | null | undefined, onrejected?: ((原因:任何)=> TResult2 | PromiseLike<...>)| null | undefined)=> PromiseLike <...>'。 “onfulfilled”和“onfulfilled”的参数类型不兼容。 参数类型“value”和“value”不兼容。 “typeof import("D:/PROGECTS/SnakeReactReduxTS/snake-react-redux-ts/src/Components/Stages/Game")”类型中缺少属性“default”,但在类型“{ default: never; }'.

他想从我这里得到什么?

最佳答案

lazy 函数返回 { default: ... } 对象的 promise ,该对象被异步调用,并且将 await 直到 promise 未被解决而被延迟 1000 毫秒,最后将导入 Game 组件并返回它。

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

希望这对您有所帮助!

关于javascript - TypeScript + React.Lazy,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62594862/

相关文章:

javascript - 绝望的图像定位问题

javascript - jQuery Mobile -> 页面生命周期?

javascript - 如何使用 RxJS 发出多个 HTTP 请求并将响应合并到一个有效负载中并将其映射到另一个操作?

javascript - ReactJs 中的替代 prev 函数是什么?

javascript - 了解 Suspense 和 React Hooks

typescript - 如何创建一个在 typescript 中返回 bool 值的 API?

javascript - 我怎样才能将这支笔的代码整合到我的网站上?

javascript - 出现错误时重新运行函数并传递结果

javascript - Redux 表单中,VALUES 从哪里来?

import - Webpack/typescript 需要工作但导入不