Question

我正在创建一个基本的登录表单，用于存储带有输入的任何凭据的令牌。在我的 useToken.js 中，我创建了一个应该删除令牌的箭头函数：

const removeToken = (userToken) => {
    localStorage.removeItem("token");
    setToken(null);
};

在我的标题中，我有一个注销按钮，当点击它时应该 removeToken 和注销用户。我应该注销用户的 Header.js 按钮如下所示：

<Button variant="danger" onClick={removeToken}>
      LogOut
</Button>

它抛出 removeToken 未定义错误。

Answer 1

localStorage.clear();

看看这个（：

Answer 2

基于抛出的定义错误，您似乎没有将函数 removeToken 导入到您尝试使用的模块中。所以先导出再导入再使用。

修复后的代码可能看起来像那样

useToken.js

export const removeToken = (userToken) => { // export function from module 
  localStorage.removeItem("token");
  setToken(null);
}

Header.js

import { removeToken } from './useToken.js' // import removeToken function from useToken.js module
...
<Button variant="danger" onClick={removeToken}>
   LogOut
</Button>

在根据您的项目结构导入时不要忘记调整模块的路径。

尝试通过“注销”按钮从本地存储中删除令牌

2 个答案: