0

基本上，我有一个登录页面，当你填写表格并提交数据时，它会通过这个

const formSubmitHandler = (e) => {
    e.preventDefault();
    
  //validation and other uninteresting stuff...

    axios.post('/signin', { email: inputs.email, password: inputs.password })
    .then(response => {
      localStorage.setItem('token', JSON.stringify(response.data.token));
      addUser({ id: response.data.id, name: response.data.username }); 
      history.push('/');
    })
    .catch(err => setLastError(err.response.data));
  }

它有效，但我收到警告

警告：无法对未安装的组件执行 React 状态更新。这是一个空操作，但它表明您的应用程序中存在内存泄漏。要解决此问题，请在 useEffect 清理函数中取消所有订阅和异步任务。

所以我用谷歌搜索了这个问题，然后尝试添加 axios 取消令牌，更准确地说是我设置

let source = axios.CancelToken.source();

然后将以下内容添加到我的 axios 请求中

  ..., { cancelToken: source.token }).then...

最后

componentWillUnmount = () => {
    source.cancel();
}

但我仍然收到警告。我已经失去了几个小时试图摆脱这个，我正在失去宝贵的时间，而且似乎没有任何效果。

此外，无论出于何种原因，如果我删除了addUser函数，我就会失去警告，但这没有任何意义，因为这只是一个 Redux 调度，而且据我所知，它们应该是同步的并且无事可做与组件的本地状态。

可能是什么问题？

4

1 回答 1

0

你可以试试：

axios.post('/signin', { email: inputs.email, password: inputs.password })
.then(response => {
  localStorage.setItem('token', JSON.stringify(response.data.token));
  addUser({ id: response.data.id, name: response.data.username }); 
  return <Redirect to='/'/>;
})
.catch(err => setLastError(err.response.data));
于 2021-10-26T16:52:34.207 回答