如何在React中使用useCookies完全删除cookie而不留下未定义

Question

所以我有一个 django-react 应用程序，其中使用 django-rest-framework 令牌身份验证包。我将从 API 调用中获取令牌并将其插入到一个钩子 (useCookies) 中，该钩子将作为 cookie 存储。我的代码如下：

import { useCookies } from "react-cookie";

const Home = () => {
     const[token, setToken, removeToken] = useCookies(['loginToken']);
}

const loginBtn = () => {
  APIService.LoginUser({
    username: username,
    password: password,
  })
    .then((response) => {
      setToken("loginToken", response.token);
    })
    .catch((error) => console.log(error));
};

现在我正在尝试创建一个注销功能，用户只需按注销按钮即可注销。到目前为止我所拥有的是：

const logout = () => {
     removeToken(['loginToken']);
}

当按下按钮时，它会将我的 cookie 的值变为未定义。 前

loginToken: 'asd99123jsd9asd9231'

后

loginToken: 'undefined'

从我读到的文档来看，它应该完全删除cookie，甚至不留下cookie变量。我在这里可能会错过什么？预先非常感谢您。如果您需要更多信息，我非常乐意为您提供，请耐心等待，因为这是我的第一个 React 项目。

Answer 1

我在删除 cookie 时遇到了同样的问题。就我而言，调用removeCookie 时的cookie 是相同的。然后我找到了解决办法：我没有告诉路径去掉cookie功能。

removeCookie('cookie-name',{path:'/'});

PS - 在这里找到解决方案（另一个 StackOverflow 问题）：cookies.remove('abc') 在reactJs 中不起作用

Answer 2

cookies API 的remove ()方法根据给定的名称和URL 删除cookie。

browser.cookies.remove('loginToken')