问题标签 [react-suspense]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
1291 浏览

reactjs - 测试悬念时不支持错误

尝试使用react-testing-libraryto test时遇到一个奇怪的错误React.Suspense。该错误只是说“不支持”,但没有对问题提供任何真正的洞察力。我遵循了Kent Dodds 在 youtube 上所做的示例。

我在这里 github 上发布了我的问题的完整代码,但这里是测试代码的快照:

0 投票
0 回答
185 浏览

reactjs - 我们是否需要每次都在反应悬念中抛出相同的承诺

在功能组件的主体中获取数据时,如果我理解正确,表达式应该评估为抛出的承诺或响应值。Suspense 是否需要每次都抛出相同的承诺或任何承诺?它对承诺有什么作用吗?

0 投票
1 回答
541 浏览

javascript - React Suspense 试图解决什么问题?

我在 reactjs.org 中看到了一些示例,但我想知道他们试图解决的问题和/或它背后的魔力是什么。除了反应文档中已有的内容之外,我如何在实际项目中使用它。

0 投票
1 回答
1703 浏览

javascript - 显示 github、youtube,例如每次路线更改的进度

react 本身引入了一个使用suspense 和lazy 的代码拆分和异步路由的新概念。有了这个概念,当路线改变时,我们如何在页面顶部显示进度条。我可以显示加载图标、文本等,但不能显示进度条(0 到 100%)。这是我的做法

延迟加载.js

这是codeandbox中的示例,其中我也有进度组件,但不知道在以我正在做的方式使用悬念和懒惰时如何实现它

https://codesandbox.io/s/zw7mx97293jav

0 投票
1 回答
912 浏览

reactjs - Suspense component gets called before the data actually loads

I'm trying to add react lazy in my application, and for some reason, it doesn't seem to work.

The component in which I want the lazy load to work on, fetches its data from a server, then it renders the data. The problem is, the component in which the data is getting fetched, which is in the suspense tag, gets loaded before the data actually loads. Here's my code:

AnotherTest.jsx

Test.jsx

0 投票
1 回答
697 浏览

reactjs - How to use multiple react suspense fallbacks with reach router?

I'm using "@reach/router": "^1.2.1" and in my App.js file I've got a fallback component to show while my routes are loading:

But depending on the route, I want to use a different loading component as the fallback, so something like:

This won't work because Router needs to be wrapped around Suspense, instead of this way around. But if I split it like below then the second Router list doesn't get picked up and the route is a 404:

What is the correct way to provide a fallback component on a routing level?

0 投票
1 回答
798 浏览

reactjs - 无法使用 switch 语句渲染路由 React router dom 5.0.0

我对 React Router 还很陌生。我正在使用 React-router-dom 5.0.0

由于某种原因,我的仪表板路线不匹配,当我导航到/dashboard

我做错了什么吗?

0 投票
4 回答
6017 浏览

reactjs - 反应未在动态路由上加载的惰性组件

我在动态路由上使用了反应惰性和悬念,但不知何故我无法渲染延迟加载的组件。

我已经搜索过惰性路由的使用,但我还没有看到有人在动态(本地主机:8080/动态/动态)路由上使用它。

在动态路由上加载组件对我有用,如果我有静态路由,延迟加载也适用,但是当我尝试将两者结合时,组件不会加载。

这是我所做的一个例子,

我只想在我去那条路线后加载我的组件。但是结果是它加载了 Home 但是当我从选择中选择一个时,它只显示 index.html 空白我没有看到任何错误产生。

0 投票
4 回答
3732 浏览

javascript - 将 NProgress 与“React.lazy”一起使用

我有以下组件树:

React.Suspense用来显示加载回退。但是,现在我想在当前页面的顶部显示一个进度条,而不是使用普通的 Suspense 加载回退,这会删除整个当前路由以显示回退。

例如,如何添加 NProgress 来指示正在加载的页面的加载进度?

也许新的 React 的并发模式可以帮助解决这个问题?:)

0 投票
2 回答
4979 浏览

reactjs - 使用 React.lazy 和 Suspense 进行代码拆分时无法在未安装的组件上找到节点

我已经使用 React.lazy 和 Suspense 添加了代码拆分,并在添加它们之后按预期呈现组件但是当我从一个组件导航到另一个组件时会引发错误

无法在未安装的组件上找到节点。

当我删除代码 Suspense 和惰性选项时,错误消失了。关于我为什么得到这个的任何想法?