如何在useEffect中使用useNavigate时停止无限运行
如何在useEffect中使用useNavigate时停止无限运行
提问于 2022-11-02 07:14:17
我在做一家电子商店。我有登录用户的uid。我试图设定一个条件，如果登录的用户uid不等于admin uid，那么我不希望该用户进入管理页面。useEffect运行无限。
const navigate = useNavigate();
const user = localStorage.getItem("uid");
useEffect(() => {
if (user === 'at64ZIYgqaawRyCAkH6xMYBRNwS2') {
navigate('/admin')
}
else {
navigate('/home')
}
})
回答 3
Stack Overflow用户
发布于 2022-11-02 08:22:14
我想让你考虑一些事情。
为了检查用户是否是管理员，请不要使用此uid。
这可能适用于单一类型的应用程序，但假设同时有多个管理员试图访问应用程序，则会失败！
要比较用户类型，您不应该使用if else条件和uid，而是应该获取一个get Api，它以uid令牌作为查询，从数据库中获取数据，然后比较user_type。
一个基本的例子是这样的：前端：
const obj=axios.get("http://localhost:7099")
.then(res=>//..handle response)
.catch(err=>//..handle error)Backend/Server:
USER_OBJECT:
user={
user_type:"admin" || "default",
user_name:...,
user_age:...,
.
.
.
.
}您可以像这样使用UseEffect：
useEffect(() => {
//Todo
}, [])Stack Overflow用户
发布于 2022-11-02 07:20:12
useEffect的运行不是无限的：
useEffect(() => {
//Todo
}, [])可以在[]中写入变量状态，也可以不写入变量状态。
Stack Overflow用户
发布于 2022-11-02 08:08:42
应该将依赖项数组添加到useEffect中，这意味着钩子应该运行所有依赖项的更改；因此，如果只想运行一次，那么应该向useEffect添加一个空数组：
useEffect(() => {
if (user === 'at64ZIYgqaawRyCAkH6xMYBRNwS2') {
navigate('/admin')
}
else {
navigate('/home')
}
}, []) // this [] is dependencies array页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/74285555
复制相关文章
相似问题
腾讯云开发者
