在React中如何使用useCookies完全删除cookie而不残留undefined值

问题原因 #

你调用removeToken时参数传递错误，react-cookie的useCookies返回的移除方法第一个参数为单个cookie名称的字符串，不是数组。

解决方案 #

1. 修正removeToken的传参，将数组改为字符串

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

2. 若存储cookie时额外配置了path/domain/secure等属性，移除时必须传入完全相同的配置项才能正确匹配删除cookie。
   举个例子，如果你存储时的代码是：

setToken("loginToken", response.token, { path: '/', secure: true });

那么移除时需要同步传入相同配置：

const logout = () => {
     removeToken('loginToken', { path: '/', secure: true });
}

3. 补充优化建议：配合Django DRF的token认证逻辑，登出时建议先调用后端的token销毁接口，将服务端存储的token作废，避免本地删除后token依然有效被冒用的安全问题。

内容的提问来源于stack exchange，提问作者Owenn