javascript - react 可加载多资源加载不起作用

Question

为了提高站点性能，我正在考虑对一些在初始构建时不需要的组件进行代码拆分。在寻找了一些选项后，我决定选择 react-loadable .

根据react-loadable文档，我们可以加载multiple resources在平行下。有了这个想法和文档中给出的示例代码，我是 trying to implement一个组件，它获取组件以及渲染组件所需的数据。但我面临的问题是，每次我尝试使用 Loadable.Map 函数时，我都会在控制台中收到 TypeError: loader is not a function ，并且仅显示加载状态。文档是否损坏或我的实现是否损坏？

Answer 1

loader 对象中的项必须是函数

所以改变

Loadable.Map({
  loader: {
    Post: () => import("./Post"),
    data: fakeAPI()
  },

至

Loadable.Map({
  loader: {
    Post: () => import("./Post"),
    data: () => fakeAPI()
  },

甚至

Loadable.Map({
  loader: {
    Post: () => import("./Post"),
    data: fakeAPI
  },

查看更新的演示:https://codesandbox.io/s/my19zqk78