Javascript 在useEffect中设置状态正在破坏我的数据结构？

我试图在useEffect挂钩中设置状态，但它返回了一个无限嵌套的对象，而不是平面集合：

  const [items, setItems] = useState([]);
  useEffect(() => {
    if (loading || error) return;
    let { items } = data;
    items = items.map(r => ({
      ...r,
      questionData: JSON.parse(r.data),
      updatedAt: format(new Date(`${r.updatedAt}.000Z`), 'yyyy-MM-dd')
    }));

    setItems(items);
  }, [loading, error, data]);

希望如此：

但是我得到了这个：

为什么要设置一个名为items的状态，并在useffect中设置一个名为items的局部变量？那会引起问题的

只需将局部变量更改为更合理且不与状态冲突的名称

let dataItems = data;
dataItems = dataItems.map(dataItem => ({...})

---

最初什么是

items

？items是对象[{}，{}，{}，{}]的集合，就像在预期的图像中一样，但由于某种原因，当我尝试设置它时，它会变成一个嵌套对象数组，永远不会结束

[{{{{{}，{{{{}}]

从

数据

获取

items

，但是，将其设置为

setItems（items）

会让我非常怀疑，这个问题与您的更新模式有关，而不是与循环有关。您可以演示如何声明状态挂钩吗？我是这样做的

const[items，setItems]=useState（[]）我不喜欢重复的变量名
项
。它们会相互冲突吗？
let dataItems = data;
dataItems = dataItems.map(dataItem => ({...})