Question

我是创建功能组件的新手，在类组件中，我们在此声明注销功能

logout = () => {
    sessionStorage.setItem("userToken", '');
    sessionStorage.clear();
    this.setState({ redirect: true });


}

格式，但是我不知道如何声明变量以及如何将推写到另一个功能组件。

有人可以在这个查询中帮助我吗？

Answer 1

React Router v4现在为无状态/功能组件添加了useHistory挂钩。可以处理您的情况下退出的示例代码段

import { useHistory } from "react-router-dom";

function Logout() {
  let history = useHistory();

  function handleLogOut() {
    sessionStorage.setItem("userToken", '');
    sessionStorage.clear();
    history.push("/sigin"); // whichever component you want it to route to
  }

  return (
    <button type="button" onClick={handleLogOut}>
      Go home
    </button>
  );
}

Answer 2

除了@ sv12提供的答案外，您还可以使用历史记录模块。

import { createBrowserHistory } from 'history';

export const history = createBrowserHistory();

如何使用reactjs在功能组件中编写注销功能？

2 个答案: