Sweet Alert在退出React时短暂显示

Question

使用react which:处理我的注销功能

1. 清除本地存储
2. 清除令牌
3. 重定向到主页
4. 显示警报

我的甜蜜警报有效，它很快就消失了。这是我的注销组件的代码：

import swal from 'sweetalert';
import { setToken } from '../api';
const Logout = () => {
localStorage.clear();
setToken('');
location.href = "/home/";
<SweetAlert
title="You are now logged out!"
onConfirm={this.onConfirm}
onCancel={this.onCancel}
btnSize="sm"
/>
}
export default Logout;

Answer 1

设置location.href = ...将重新加载浏览器选项卡，因此您在此处渲染的任何组件都将消失。(我猜，如果你在这里导入的swal函数出现的话，你会将你的警报JSX封装在它中，但我在你的例子中看不到这一点。看起来它就是这样工作的(。

如果您使用的是react路由器，那么类似于带有useHistory的history.push('/home')可能会解决这个问题。