중첩배열에 데이터 추가하기
본문
리액트를 기본으로 하고있습니다.
localStorage에 아래와 같은 기본 중첩 배열이 있습니다.
const recipestate = [
{
"id": 0,
"date": "2022.09.21" ,
"list": [
{
"num":,
"revenue" : ""
"listTit": "",
"won":
}
]
},
{
"id": 1,
"date": "2022.09.22" ,
"list": [
{
"num":,
"revenue" : ""
"listTit": "",
"won":
}
]
}
]
위 데이터에 form을 사용해서 버튼을 클릭하면
데이터에 id값과 dnum 이라는 변수를 비교해서 같으면 list 라는 데이터에 순차적으로 데이터를 추가시키고 싶습니다.
setData(
Data.map((data) => {
return data.id === dnum ? "list값에 데이터 쌓임" : "그대로"
})
)
"list": [ { "num": 1, "revenue" : "" "listTit": "", "won": }, { "num": 2, "revenue" : "" "listTit": "", "won": } ]
// 요런식으로 쌓이고 싶습니다.
아래는 제가 생각한 방법인데 그냥 아래로 쌓이네요ㅠ
const [Data, setData] = useState(recipestate);
const [Listuse, setListuse] = useState(Data[dnum].list)
const nextId = useRef(0)
const handleSubmit = (e) => {
e.preventDefault();
const Datalist = {
num: nextId.current,
revenue,
listTit,
won
}
setListuse(
[...Listuse, Datalist]
)
setData(
[...Data, Listuse]
)
nextId.current += 1;
};
제가 검색을 해도 리액트로 중첩배열에 데이터 추가하는 방법을 모르겠어서 혹시 아시는 분이 계실까 적습니다!ㅠㅠ
답변 1
data.map((item) => {
if (item.id === dnum) {
let obj = {};
obj.num = "1";
obj.listTit = "2";
obj.won = "3";
item.list.push(obj);
}
return item;
});
이거 활용하면 가능 하지 않을가요?
댓글 달아줘서 감사합니다! 다행이 이것저것 해보다가 얻어걸려서 해결했습니다! 감사합니다
답변을 작성하시기 전에 로그인 해주세요.
