我怎样才能在 useCallback 中获取 useState 值（反应钩子）

Question

我无法获取 useCallback 内部的 useState 值。当我运行下面的代码时，

import React, { useCallback, useEffect, useRef, useState } from 'react';

const DBLab = () => {
    const [hashHistory, setHashHistory] = useState("initial_value");
    const [inputValue, setInputValue] = useState("");
    const didAuthMountRef = useRef(false);

    const set = useCallback(() => {
        const decodeHash = decodeURI(window.location.hash);
        console.log();
        console.log("decodeHash: " + decodeHash);
        console.log("hashHistory: "+ hashHistory);
        setHashHistory(decodeHash);
    },[hashHistory]);

    useEffect(() => {
        const startFunc = async() => {
            set();
            window.addEventListener('hashchange', set);
            didAuthMountRef.current = true;
        }
        if(!didAuthMountRef.current) {
            startFunc();
        }
    }, [set]);
    return (
        <div>
            <h1>dblab</h1>
            <h1>{hashHistory}</h1>
            <input type='text' value={inputValue} onChange={(e)=>setInputValue(e.target.value)}/>
        </div>
    )
}

export default DBLab;

在网络控制台中，我得到

decodeHash: #/dblab#first

hashHistory: initial_value

这是对的。但是当我将 url 更改为 http://localhost:3000/#/dblab#next 时，我得到


decodeHash: #/dblab#next

hashHistory: initial_value

这是错误的。因为 hashHistory 没有改变。但这不是 useState 问题。因为我在屏幕上看到 <h1>{hashHistory}</h1> 的 hashHistory 是 #/dblab#next，这是正确的哈希。

如何在 useCallback 中获取正确的 hashHistory？

ps。我必须使用 useCallback.

Answer 1

useEffect(() => {
    const startFunc = () => {
        if(!didAuthMountRef.current) {
            set();
            didAuthMountRef.current = true;
        }
        window.addEventListener('hashchange', set);
    }
    startFunc();
    return ()=> {
        window.removeEventListener('hashchange', set);
    }
}, [set]);

逻辑问题

我怎样才能在 useCallback 中获取 useState 值（反应钩子）

how can i get useState value inside useCallback (react hook)

reactjs

react-hooks

usecallback

use-state