javascript 正确处理React中的BFCache

tzdcorbm 于 2023-03-06 发布在 Java

关注(0)|答案(2)|浏览(127)

我在重定向到外部url（支付提供商）之前显示了一个加载屏幕（状态），因为它们往往会加载一段时间。
如果用户选择不完成支付并转到history.back()（手势、后退按钮......），浏览器将从BFCache中取出之前的页面，包括加载状态，用户将永远“卡”在加载中。
您建议如何处理这种情况？持久化加载可以使用pageshow事件来检测，但我不确定这是否是处理这种情况的React方式。

JavaScript

来源：https://stackoverflow.com/questions/70996926/correctly-handling-the-bfcache-in-react

2条答案

按热度按时间

ee7vknir1#

我遇到了同样的问题，最后使用了pageshow事件

const [isLoading, setIsLoading] = useState<boolean>(false);
useEffect(() => {
    window.onpageshow = function(event) {
      if (event.persisted) {
        setIsLoading(false);
      }
    };
  }, []);

赞(0）回复(0）举报 2023-03-06

s2j5cfk02#

持久化加载应该手动处理。在您的情况下，应该处理
基于pageshow事件处理程序的事件属性persisted的加载程序状态。

赞(0）回复(0）举报 2023-03-06