react路由无法跳转（To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function）
//问题：每次提交表单成功后跳转路由都回马上返回登陆页（手机必定出现，pc不出现）
//react提示error：Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.
//翻译:无法在未挂载的组件上执行React状态更新。这是一个无操作，但它表明应用程序中存在内存泄漏。若要修复，请在useEffect清理函数中取消所有订阅和异步任务。
//解决方法：加上return 或去掉finally方法
//记录遇到得一个react问题 此处是别人写的提交表单的方法
const onFinish = (values: any) => {
setloading(true);
services
.post('/user', { ...values, t: returnT })
.then((res) => {
if (res?.data?.success) {
localStorage.setItem('token', res.data.data.token);
localStorage.setItem('user', JSON.stringify(res.data.data.user));
setState('token', res.data.data.token);
setState('user', res.data.data.user);
history.push('/version');
Toast.success('登陆成功');
}
})
.catch((err) => {
const msg = err?.response?.data?.message;
Toast.fail(msg || '登录失败');
setloading(false);
setCaptchNum(Math.ceil(Math.random() * 89994494));
//到这里为止一切正常
})
//问题发生的地方，每当路由跳转后都会执行
.finally(() => {
// setloading(false);
return ; //加上return 或去掉finally方法即解决问题
//该问题造成原因为组件卸载后，permission方法回调执行finally react提示为内存泄漏，需要清理useEffect中的异步
});
};
//我首先检查自己写的useEffect方法，发现不是自己的问题
//于是检查，想到onFinish 会不会是组件外已经嵌套了useEffect
//便进行测试，最终想到跳转后依然会执行finally方法，于是尝试删除finally和return一个返回值
//结果问题果然解决