div submit 관련 질문입니다.
챕터 8의 7.7 리뷰 삭제하기 기능 중 궁금한 점이 생겨 질문 남깁니다!
form 서버액션을 사용하고 있는데
<div>, <a> 태그를 통해 form submit을 해야하는 상황, 요구사항이 발생할 수 있다고 하셨는데 어떤 경우에 사용하게 되는건지가 궁금합니다.
답변 2
1
안녕하세요 귀한 불도새님 이정환입니다.
아래 AI 인턴이 자세하게 답변을 달아 주었네요!
해당 답변을 확인해보시면 스타일링이나 네비게이션 링크와의 통합 등의 이유로
굳이 button이 아니더라도 <a>나 <div> 태그를 통한 폼 제출이 필요한 경우가 종종 있습니다.
1
안녕하세요, 인프런 AI 인턴입니다. 귀한 불도새님!
div 나 a 태그를 통한 폼 제출은 주로 사용자 경험을 향상시키기 위한 경우에 사용됩니다. 다음은 이러한 경우에 대한 몇 가지 시나리오를 설명드리겠습니다:
스타일링과 사용자 경험: 경우에 따라 개발자가 버튼 대신 div나 a 태그를 사용하여 더 복잡한 스타일링이나 애니메이션을 적용하고 싶을 수 있습니다. 이 경우 사용자 인터페이스를 더욱 매끄럽게 하고 싶을 때 div나 a 태그를 사용하여 폼 제출을 유도할 수 있습니다.
내비게이션 링크와의 통합: a 태그는 기본적으로 내비게이션 링크로 사용됩니다. 만약 사용자가 링크를 클릭할 때 폼을 제출하고 싶다면, a 태그에 폼 제출 로직을 추가할 수 있습니다.
JavaScript 이벤트 핸들링: Javascript를 사용하여 특정 이벤트(예: 클릭, 마우스 오버 등)에서 폼을 제출하는 경우 div나 a 태그를 통해 보다 직관적인 사용자 상호작용을 구현할 수 있습니다.
접근성 측면: 버튼 외의 HTML 요소들을 사용하여 폼 제출을 구현할 때에는 반드시 접근성을 고려해야 합니다. 사용자와의 상호작용을 지원하기 위해 필요한 aria 속성과 같은 접근성 관련 속성을 추가로 고려해야 합니다.
위 시나리오들을 바탕으로 div나 a 태그를 통한 폼 제출은 특정 요구사항이나 사용자 인터페이스 설계에 맞춰 사용될 수 있습니다.
추가적인 정보를 확인하거나 유사한 질문을 살펴보시려면, 아래 링크를 참고하실 수 있습니다:
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.
풀라우트캐시 동작 원리에서 데이터 캐시 관련 질문
0
58
2
next.js 프로젝트
0
54
1
Next.js + Tanstack Query BFF 구조 질문
1
52
2
Next.js 사전렌더링 이해하기 부분
0
56
2
모달 관련 질문
0
60
3
렌더링 관련 질문
0
92
2
중복으로 하나의 api를 요청할 때 캐싱 옵션 통일화
0
78
2
라우트 세그먼트 옵션 강좌 노트에 사소한 제보 남깁니다.
0
76
2
SSR시 context에 params말고 query를 사용하면 안되나요?
0
90
2
npx prisma db push 시 에러가 뜹니다.
0
111
3
vercel 배포를 실패하였습니다.
0
122
3
Image 컴포넌트 사용시 브라우저 콘솔에 경고는 왜 뜨는걸까요?
0
74
2
getServerSideProps 함수와 SSR의 관계
0
89
6
없는 페이지인데 풀라우트캐시로 저장이 되는 이유가 궁금합니다
0
71
2
실제 프로젝트에서 SSR 사용에 관해서 질문드립니다.
0
128
2
일반적인 nextjs project architecture에 대하여..
0
97
2
2.14 Search에서 작성한건 static이긴하지만 CSR이 아닌가요?
0
83
2
배포 시 오류 발생
0
98
2
백엔드 서버 오류납니다.
0
97
2
취약점 제거시 nestjs 버전 문제가 생길까요?
0
103
1
eslint.config.mjs 내 rules 어떻게 설정 하나요?
0
115
1
[book]/[id]/page.tsx 모달 띄울 때 성능 하락 현상은 ReviewList를 불러오면서 발생하는 문제 같습니다.
0
69
2
빨간줄 설정
0
89
2
익스텐션 질문
0
66
1