复现版本

umi@3.1.4

@ umijs/plugin-钱坤@2.2.0

子应用程序呈现空白的情况很多。这里，浏览器返回导致空白。

一开始我以为某一步是错的，后来发现是钱坤的Bug，应该以后再修复。在修复之前，我不得不黑自己。

先看问题，录gif。

复制步骤：

在子应用程序页面上刷新一次。

子应用程序单击可跳转的链接。

单击浏览器左上角的-return进行重现。

问题原因

这个问题的原因也很奇妙。第一次加载时，只有当它是子应用程序时才会被触发。如果是父应用程序的页面，就不会有这个问题。浏览器后退按钮需要被触发。

解决方案

原因找到了，解决方法很简单，思路是：

1.创建一个新的空白页，这里命名为Blank.jsx。

2.跳转到布局中的Blank.jsx页面。

3.加载Blank.jsx并返回到上一层。

Blank.jsx的代码如下。

从“react”导入{ useEffect }；

导出默认函数空白({历史记录}){ 0

useEffect(()={ 0

history . goback()；

}, []);

返回null

}

跳转布局，伪代码：

从“React”导入React；

类App扩展了React。组件{

componentDidMount(){ 0

this . props . history . push('/blank ')；

}

}

因为Blank.jsx不渲染DOM，所以没有任何划痕。

解决后的效果：

原文链接：https://www.xiejiahe.com/blog/detail/5ede2998bf0177330788adab