小编MRN*_*siA的帖子

为什么调用 useState 钩子的 set 函数会立即应用于异步函数?

在同步和异步函数中调用 useState 挂钩的多个设置函数时,我遇到了不同的行为。

function Test() {
    console.log('app rendering starts.');
    const [a, setA] = useState(1);
    const [b, setB] = useState(11);
    const updateState = () => {
        console.log('\tupdating a starts.');
        setA(2);
        console.log('\tupdating a ends.');
        console.log('\tupdating b starts.');
        setB(12);
        console.log('\tupdating b ends.');
    };
    console.log('app rendering ends.');
    return (
        <div className="App">
            <div>a is {a}</div>
            <div>b is {b}</div>
            <button onClick={() => {
                console.log('--------------sync click--------------');
                updateState();
            }}>Update State a & b Sync</button>
            <button onClick={() => {
                console.log('--------------async click--------------');
                setTimeout(updateState, 0)
            }}>Update State a & b Async</button> …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs react-hooks

6
推荐指数
1
解决办法
111
查看次数

标签 统计

javascript ×1

react-hooks ×1

reactjs ×1