从本地存储获取当前用户时无法设置它

Question

const [当前用户，setCurrentUser] = useState(未定义)

useEffect(() => {
    async function fetchdata() {
        const storedUser = localStorage.getItem("chat-app-user");
        if (!storedUser) {
            navigate("/login");
        } else {
            const user = await JSON.parse(storedUser);
            console.log("Fetched user from localStorage:", user);
            setCurrentUser(user); 
        }
    }
    fetchdata();
}, [navigate]);

我正在尝试设置CurrentUser。我从本地存储获取一个用户，但将其设置为 setCurrentUser 时，它没有被设置，并且 currentUser 保持未定义状态

Answer 1

问题是目前 fetchdata() 是一个异步函数，您的代码不会等待它完成。不过，请参阅下面的观察和建议。

以下代码不正确，因为 JSON.parse 不是异步函数。 因此它不会像代码预期的那样返回承诺。

 const user = await JSON.parse(storedUser);

当代码更正如下时，就不需要 fetchdata 函数是异步的。

 const user = JSON.parse(storedUser);

因此，相同的函数可以编写为同步函数，如下所示：

 function fetchdata() {
        const storedUser = localStorage.getItem("chat-app-user");
        if (!storedUser) {
            navigate("/login");
        } else {
            const user = JSON.parse(storedUser);
            console.log("Fetched user from localStorage:", user);
            setCurrentUser(user); 
        }
    }

现在问题就解决了。