如何将反应js中的多个对象推送到数组？答案

【问题标题】：how to push multiple objects in react js to array?如何将反应js中的多个对象推送到数组？
【发布时间】：2021-09-27 17:43:43
【问题描述】：

您好，我试图在我的数组中存储一些数据，我确实尝试了 allData.push(Data1, Data2, Data3)，但它说 .push 不是一个函数，它也没有让我只是 allData(Data1, Data2, Data3)，我得到的数据它覆盖了前一个。我也试过allData(Data1+Data2+Data3)

这是我的代码：

useEffect(() => {
    let x = 0;
    
    LibrosID1.map((i) => {
      x += i.precio
    })

    LibrosID2.map((i) => {
      x += i.precio
    })

    LibrosID3.map((i) => {
      x += i.precio
    })

    setAllItems(LibrosID1, LibrosID2, LibrosID3)
    setSubTotal(parseFloat(x).toFixed(2))

  });

// I have 3 like this the only thing that changes is variable # from 1 to 3

const [LibrosID1, setLibrosID1] = useState([]);
    const handleChange1 = (e, data) => {
    const { name, checked } = e.target;
    if (checked) {
      // if cheked and selectall checkbox add all fileds to selectedList
      if (name === "allSelectNuevos") {
        setLibrosID1(librosNuevos);

        let x = 0
        librosNuevos.map((i) => {
          x += i.precio
          setTPLibrosNuevos(parseFloat(x).toFixed(2))
        })

      } else {
        // if cheked and specific checkbox add specific field to selectedList
        setLibrosID1([...LibrosID1, data]);

        let x = 0
        LibrosID1.map((i) => {
          x += i.precio
          setTPLibrosNuevos(parseFloat(x).toFixed(2))
        })
      }
    } else {
      // if uncheked and selectall checkbox add remove all fileds from selectedList
      if (name === "allSelectNuevos") {
        setLibrosID1([]);

        let x = 0
        librosNuevos.map((i) => {
          x = 0
          setTPLibrosNuevos(parseFloat(x).toFixed(2))
        })

      } else {
        // if uncheked and specific checkbox remove specific field from selectedList
        let tempuser = LibrosID1.filter((item) => item.id !== data.id);
        setLibrosID1(tempuser);

        let x = 0
        tempuser.map((i) => {
          x += i.precio
          setTPLibrosNuevos(parseFloat(x).toFixed(2))
        })
      }
    }
  };

  useEffect(() => {
    console.log(LibrosID3, tpPaqueteCuadernos, allItems);
 }, [LibrosID1, tpLibrosNuevos])

简而言之，我正在计算我的小计并且该位正在工作，现在我想将我“购买”的所有项目存储在 allItems 中

这是我点击 LibrosID1 all 复选框时打印的内容：

这是我点击 LibrosID2 all 复选框时打印的内容：

最后，当我点击最后一个 LibrosID3 all 复选框时：

如您所见，它仅添加来自 LibrosID1 的值，即使我将其命名为 setAllItems(LibrosID1, LibrosID2, LibrosID3)

欢迎提供任何提示、文档和帮助。

【问题讨论】：

标签： arrays reactjs

【解决方案1】：

通过查看您的代码，我假设 setAllItems 应该存储数组。为此，您需要将数组传递给setAllItems，例如setAllItems([LibrosID1, LibrosID2, LibrosID3])

【讨论】：

是的，这似乎有效，但现在我得到一个无限循环，原因是在 useEffect 内
Warning: Maximum update depth exceeded. This can happen when a component calls setState inside useEffect, but useEffect either doesn't have a dependency array, or one of the dependencies changes on every render.
那是正确的，因为您在 useEffectect 内部更新 allItems 而没有任何依赖关系，这意味着每次状态发生任何变化时它都会运行。您可以查看这些链接。 stackoverflow 和 reactjs.org
但是我对我的 subTotal 做的完全一样，而且我的 subTotal 并不仅仅发生在我的 allItems 上……现在我很困惑。
并没有真正保存数据，因为我只是仔细检查了将其发送到其他地方有什么想法吗？