[ 목차 ]
728x90
반응형
res.render() 메서드는 Express 애플리케이션에서 뷰 템플릿을 렌더링하여 클라이언트에게 HTML 페이지를 제공하는 역할을 한다. 이 메서드를 사용하여 뷰 템플릿과 클라이언트 사이의 상호작용을 가능하게 한다.
✔ 예제 코드
res.render('mypage', {session: req.session, email_id: email[0], email_com: email[1], userInfo: result.data, accountList: accountList, csrfToken: req.csrfToken()});res.render() 메서드:
res.render(view, [locals], callback) 형태로 사용된다.
view:
렌더링할 뷰 템플릿의 이름을 지정한다. 이 이름은 뷰 템플릿 파일의 경로에서 확장자를 제외한 이름을 의미한다. 예를 들어, 'mypage.ejs' 라는 파일은 view에 'mypage'를 입력한다.
locals (선택적):
뷰 템플릿에 전달할 데이터를 객체 형태로 지정한다. 이 데이터를 통해 뷰 템플릿에서 동적인 내용을 생성할 수 있다.
callback (선택적): 뷰 템플릿 렌더링이 완료된 후 실행되는 콜백 함수를 지정할 수 있다.
locals 객체와 뷰 템플릿에서 사용:
locals 객체에 담겨진 데이터는 뷰 템플릿에서 특정 변수 이름을 통해 접근할 수 있다. 이를 통해 뷰 템플릿에서 데이터를 동적으로 사용할 수 있다.
위 코드에서는 다양한 데이터를 locals 객체에 담아 'mypage' 뷰 템플릿에 전달하고 있다. locals 객체에 포함된 각 데이터는 뷰 템플릿에서 해당 변수 이름을 사용하여 접근할 수 있다.
✔ userInfo 객체의 name 값을 출력하는 방법
<!-- mypage.ejs -->
<!DOCTYPE html>
<html>
<head>
<title>My Page</title>
</head>
<body>
<h1>Hello, <%= userInfo.name %>!</h1>
<!-- userInfo 객체의 name 속성 값을 출력 -->
</body>
</html>EJS 뷰 템플릿에서 <%= ... %> 템플릿 태그를 사용하여 userInfo.name을 출력하고 있다. userInfo 객체는 locals 객체에서 넘어온 데이터로, 해당 객체의 name 속성 값을 템플릿에 동적으로 삽입하여 사용할 수 있다.
반응형
'업무 기록 > WEB' 카테고리의 다른 글
| 자바스크립트 마크다운 검색창 만들기 (0) | 2023.09.08 |
|---|---|
| 자바스크립트 이용한 마크다운 자동 목차 만들기 (0) | 2023.09.07 |
| JSP 모달창 버튼 출력 조건 (0) | 2023.08.30 |
| Spring Security 인증처리 SecurityContextHolder.getContext(), getAuthentication(), getPrincipal() (0) | 2023.07.31 |
| JSP hidden 값 실시간 변화 감지(MutationObserver) 적용 및 조건문 (0) | 2023.07.14 |
