reactjs-useEffect未获取状态变量的更新值?

我遇到了一个问题,我体内的一切 useEffect 调用似乎没有得到更新的状态变量。

在更新我的状态变量之前 bboHistory 具有 setBBOHistory ,我打印 prev 我可以看到它每次迭代都包含额外的新值。

然而,当我打印时 bboHistory.bp 在useEffect中,每次迭代它都保持为空数组。这导致 bboHistory.bp.length 保持在0并搞砸我为fetch调用提供的参数,这反过来又会填满 data 我不断地添加重复的信息 上一个 .

然而,我的绘图图确实绘制了事物——它并不像我想象的那样是空的 bbo历史 这让我觉得 使用效果 没有看到更新的状态变量值。我该如何纠正这种行为?

非常感谢任何帮助。谢谢。

import React, {useState, useEffect} from 'react'
import Plot from 'react-plotly.js'

function PriceHistory() {
  const [bboHistory, setBBOHistory] = useState(
    {
      bt:[], bp:[], ot:[], op:[]
    });

  async function requestBBOHistory(index) {
    const response = await fetch(`http://127.0.0.1:5000/bbo-history/${index}`);
    const data = await response.json();

    setBBOHistory(prev => {
      console.log("prev",prev)
      console.log("data",data)

      return {
        bt: prev.bt.concat(data.bt),
        bp: prev.bp.concat(data.bp),
        ot: prev.ot.concat(data.ot),
        op: prev.op.concat(data.op),
      };
    });
  }

  useEffect(() => {
    const interval = setInterval(() => {
      console.log("bb_p",bboHistory.bp)
      requestBBOHistory(bboHistory.bp.length);
    }, 6000);

    return () => clearInterval(interval)
  }, []);

  return (
    <Plot
      data={[
        {
          x: bboHistory.bt,
          y: bboHistory.bp,
          type: 'scatter'
        },
        {
          x: bboHistory.ot,
          y: bboHistory.op,
          type: 'scatter'
        }
      ]}
    />
  )
}