내가 props로 전달할 state임 ㅇㅇ


return(
<div className={styles.main}>
<Maker items={items} />
</div>
)


Maker라는 컴포넌트에 전달함 ㅇㅇ




const Maker = ({items}: MakerProps) => {

return (
<div className={styles.editor_ctrg}>
<EssentialItemEditForm items={items} />
<CookwareItemEditForm items={items} />
</div>
)}



여기서 발생하는 문젠데 똑같은 state를 하나의 컴포넌트에만 전달하면 문제가 안생기는데,

위에 코드처럼 두놈에게 전달하면 에러 뜸;;;




각각의 컴포넌트는 아래처럼 똑같이 생김


export const EssentialItemEditForm: ItemEditForm = ({items}: ItemEditProps) => (
<ul className={styles.ctrg__essential}>
{
items.map((item: Item) => (
<ItemForm item={item} />
))
}
</ul>
);

export const CookwareItemEditForm: ItemEditForm = ({items}: ItemEditProps) => {
<ul className={styles.ctrg__cookware}>
{
items.map((item: Item) => (
<ItemForm item={item} />
))
}
</ul>
}


ItemForm 컴포넌트는 Items 배열에 있는 object를 순회하면서 <li>요소 만드는 놈임



이거 어디서 발생하는 문젠지 아는 쌉고수있음?