I'm trying to fill an array with objects. If I execute setState, new entries are not added, but the structure of the array is expanded. For example: initial entry (0), new entry (0->0), another entry (0->0->0). However, I would like each entry to have a consecutive number.
const [entrys, setEntrys] = useState([{ date: "", entry: "" }]); ->Click button setEntrys((prev) => [{ ...prev, date: clickedDay, entry: hinweis }]);
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
The problem you encounter is that you are using a previous state in the object you pass, for example using the spread operator "prev".
What you want to do is include the previous state in the new object saved to state, e.g. "prev" as a separate element in the array - like below.
I also provide you with a codesandboxhttps://codesandbox.io/s/romantic-solomon-l566yy?file=/src/App.js.
import "./styles.css"; import React, { useState } from "react"; const App = () => { const [entries, setEntries] = useState([ { date: "", text: "" } ]); const handleClick = () => { setEntries((prevEntry) => { return [...prevEntry, { date: "date", text: "test" }]; }); }; return ( ); }; export default App;