问题标签 [react-loadable]

我正在尝试使用react-loadable在反应路由器 v4 中进行代码拆分。我打算实现的是不要用加载组件替换当前视图，而是保留当前呈现的任何内容。并仅更改当前加载的组件的状态。有没有办法使用 react-loadable 来实现这一点。或者可能有不同的图书馆。

export default connect(mapStateToProps, mapDispatchToProps)(LoaderStripComponent);

我希望这个 LoadableStrip 呈现以前加载的组件，直到导入承诺得到解决。

如何js从react-loadable.
我正在尝试CustomButton从MyButton.js使用react-loadablein导入Home.js。这是我知道的唯一方法，是行不通的。

MyButton.js

主页.js

请帮忙。提前致谢。

我在我的 Create React App 中使用 React Loadable 进行代码拆分

https://github.com/jamiebuilds/react-loadable https://github.com/facebook/create-react-app

React Loadable 如何使用在多个包中使用的代码？

假设我有 2 个包，pageA 和 pageB，并且都使用 Breadcrumbs 组件：

页面A.js：

PageB.js：

必须将 Breadcrumbs 组件添加到两个包中。如果我先访问PageA，然后导航到PageB，是否再次下载了面包屑？或者 React Loadable / Webpack 是否足够聪明，可以知道它已经在另一个包中下载了该组件？

我有这个组件：

和测试：

如何在快照中看到 Upload 组件而不是 Loading 组件？

到目前为止，我已经尝试过setTimeOut和Promises.

一段时间以来我一直面临这个问题，当我在生产中创建新版本时，除非我刷新页面，否则我会遇到加载错误。服务人员正在更新，但不知道发生了什么。

我一直在使用以下软件包

1. 反应创建应用程序
2. 可反应加载
3. 随 create-react-app 一起出现的服务人员

我什至在 nginx 忽略缓存中添加了 service-worker.js

任何帮助将不胜感激。

这是我导入组件的方式

webpack 正在正确地制作块并在创建新版本时更新 service-worker.js。

如果我禁用服务工作者，那么它会继续从缓存中提供旧代码，直到我清除它。

但是当我启用服务人员时，它会继续加载我的错误组件，直到我刷新页面。

我有一个应用程序，其中有一个导出功能。如果用户单击“导出”菜单，我将在导出存储中调用一个函数并获取数据并将其导出到 Excel 文件中。我正在使用库 XLSX进行导出，并且我想使用代码拆分来拥有延迟加载机制来加载此依赖项。

当我阅读有关反应加载器库的文章时，我看到我们可以将组件包装到加载器中：

但就我而言，我想在我的商店中加载该功能，而不是整个组件。我怎样才能做到这一点？

我正在尝试使用 react-loadable 库进行代码拆分。它确实根据我设置的点拆分代码。但是，所有 css 文件都包含在 .js 文件中，该文件未在服务器端呈现。

在客户端，它需要获取大约 100 个单独的 css 文件来获取所有 css 文件，这会大大降低网站速度（我们在 http1）。

如何不捆绑响应 loadable ？

我已经开始使用 react-loadable 拆分代码，在我想使用 this.props 之前一切都很好。深入挖掘我发现 redux 状态是空的，就像根本没有调用 createStore 一样。createStore 中的控制台日志显示它已启动并且存储对象已正确传递。不知何故，它没有得到它在更改为 react-loadable 之前的减速器状态。

结果我遇到了很多错误，例如：

上

根.js

index.js：

configureStore.js

包.json

我正在创建一个将 React SSR 与 react-loadable 结合的新项目。（基于https://github.com/jamiebuilds/react-loadable/tree/master/example）

react-loadable 文档提到我需要添加“Loadable.preloadAll()”以确保 SSR 等待异步组件被渲染。当我打开 SSR 的页面源时，没有异步组件，也没有加载组件。

在浏览器中引导后，会呈现异步组件。

github：

https://github.com/Exomnius/spearhead/blob/master/packages/web/server/server.jsx

有人有这个问题的经验吗？我是否缺少配置？提前致谢！

在我的主要组件中，我创建了一个 ref ：

并将其分配给我的组件，该组件嵌入在 Route 中：

我的组件 TransferNew 也使用 react-loadable 及其 Loadable 组件动态加载。如果我打印 this.transfernewRef.current，我会得到一个 LoadableComponent 对象：

如何从那里访问我的组件 TransferNew？我似乎找不到合适的方法来做到这一点。我只想调用一个 TransferNew 的函数，所以按照这些思路：

this.transfernewRef.current.<something>.myFunction()

谢谢你。