2025년 8월 10일 일요일

useFieldArray 사용 중 input에는 값이 있지만 Form 전송시 값이 안넘어가는 현상에 대한 조치

useFieldArray 사용 중 input에는 값이 있지만 Form 전송시 값이 안넘어가는 현상에 대한 조치
append() 호출 전 remove()로 전체를 삭제 후 처리시 문제가 해결되었다
// 입력중인 field 전체 삭제
for (let i = options.length - 1; i >= 0; i--) {
	remove(i);
}
// 동적 옵션 필드를 추가
for (const item of selectList) {
	append(item);
}

// reset 할 경우 정적 필드 데이터가 지워지는 문제 있음
// reset({ options: selectList })

React에서 여러 태그를 루프 돌려야할 경우 key 적용하는 방법

React에서 여러 태그를 루프 돌려야할 경우 key 적용하는 방법
<ul>
    {list.map(o, i) => (
        <React.Fragment key={i}>
            <li>{o.name}</li>
            <li>{o.date}</li>
        </React.Fragment>
    )}
</ul>