th:object 질문 있습니다.

th:object를 사용하지 않으면 addForm.html에서 폼에 입력한 데이터들은 쿼리 파라미터형식으로 /form/items/add 로 날아가서 아래 컨트롤러가 @ModelAttribute로 폼 데이터를 item에 바인딩 한다고 이해하고 있습니다.

@PostMapping("/add")
public String addItem(@ModelAttribute Item item, RedirectAttributes redirectAttributes) {
    Item savedItem = itemRepository.save(item);
    redirectAttributes.addAttribute("itemId", savedItem.getId());
    redirectAttributes.addAttribute("status", true);
    return "redirect:/form/items/{itemId}";
}

th:object, th:field를 사용하는 경우에는

th:object로 빈 item객체를 받고, th:field를 사용하면 이 item 객체의 필드들이 입력 받은 값으로 세팅되고 위의 컨트롤러에 해당 item객체가 전달되는 건가요??

또 추가적으로

th:object, th:field를 사용해서 item 객체에 입력받은 값을 바인딩 해주는건 누가 하는건가요?

컨트롤러에서는 ArgumentResolver와 ReturnValueHandler가 매개 변수와 반환 값을 바인딩 해준다고 배웠는데 타임리프에서 바인딩은 누가 해주는지 모르겠네요..

안녕하세요, 인프런 AI 인턴입니다.

대영님, 질문 주신 내용을 바탕으로 th:object와 th:field의 동작 방식을 설명드리겠습니다.

th:object와 th:field의 역할

타임리프에서 th:object는 HTML form과 연계된 모델 객체를 지정하는 데 사용됩니다. 이 객체는 주로 컨트롤러에서 생성되어 모델에 담겨 뷰로 전달됩니다. th:field는 해당 객체의 각 필드에 값을 바인딩합니다. 예를 들어, <input th:field="*{name}"/>는 주어진 모델 객체에서 “name” 필드에 값이 설정되도록 합니다.

데이터 바인딩 과정

th:object: th:object="*{item}"은 item 객체를 폼의 기본 객체로 설정합니다. 이 객체의 필드들은 th:field를 통해 개별적으로 접근 가능합니다.
th:field: 각 필드 입력 요소(input, textarea 등)에서 th:field="*{fieldName}"를 사용하여 item 객체의 특정 필드와 연결됩니다. 사용자가 폼에 데이터를 입력하면 그 값이 item 객체의 해당 필드에 매핑됩니다.

바인딩 주체

타임리프와 스프링의 연동에서 폼 데이터는 클라이언트 페이지에서 서버로 전송될 때 파라미터의 형태로 전달됩니다. 서버에서는 스프링 MVC가 @ModelAttribute를 통해 이러한 파라미터를 객체에 바인딩합니다. 타임리프 자체는 이러한 역할을 직접 수행하지 않고, 학습 시 말씀이 있었던 ArgumentResolver와 같은 스프링 MVC의 기능이 이를 처리합니다.

타임리프는 클라이언트 측 HTML 데이터와 서버 측 객체의 연동을 쉽게 해주는 템플릿 엔진으로, 실제 데이터 바인딩(객체 변환)은 스프링의 작업입니다.

관련된 설명을 찾아보니 아래 링크에서 더 자세한 내용을 확인할 수 있습니다. 다른 수강생 분들의 질문과 답변이 있으니 도움이 될 거라 생각됩니다.

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

인프런 커뮤니티 질문&답변

th:object와 th:field의 역할

데이터 바인딩 과정

바인딩 주체