渲染时暂停了一个React组件，但未指定备用UI

Question

我刚刚开始研究这个新的React应用。

它在组件中使用了<Suspense />元素，但我将其删除了。然后应用程序因上述错误而崩溃。

在不了解<Suspense />的情况下是否有任何简单的解决方法？

Answer 1

我知道这不完全是@IshanPatel 的问题，但可能导致此错误消息的原因是，如果您直接在函数 hold 内使用像 useTranslation() 这样的钩子。解决方案是将该代码简单地移动到一个单独的函数中，并在那里放置钩子（参见屏幕截图）。

这首先出现在 Google 上，我想有人可能会浪费很长时间寻找修复方法，所以我想将其作为评论分享。

Answer 2

要解决此问题而又不放回Suspense，则需要摆脱React.lazy的使用。

Answer 3

You have 2 options:

1. Without Using suspense, you can configure that i18n.js like this:


    i18n
      .use(XHR)
      .use(LanguageDetector)
      .init({
        react: { 
          useSuspense: false //   <---- this will do the magic
        }
    });




2. Using Suspense, for example:



<Suspense fallback={<div>Loading... </div>}>
      <App />
</Suspense>

Answer 4

此外，请不要忘记private void performScrollToEndOfPage(final WebDriver driver) throws Exception { final JavascriptExecutor js = (JavascriptExecutor) driver; Long prev = null; while (true) { this.checkItems(driver); long val = 2000; if (prev != null) { val += prev.longValue(); } final Object current = js.executeScript("window.scrollTo(0, " + Long.toString(val) + ");return window.pageYOffset;"); if (!(current instanceof Long)) { break; } // 1000 milliseconds by try and error, if this value is too low, increase it Thread.sleep(1000); if (current.equals(prev)) { break; } prev = (Long) current; } } private void checkItems(final WebDriver driver) { final List<WebElement> elements = driver.findElements(By.tagName("a")); for (final WebElement anchor : elements) { final String href = anchor.getAttribute("href"); if ((href == null) || href.isBlank() || href.isEmpty()) { // TODO: throw Exception or whatever } } } 组件中的fallback道具-没有它就无法工作。