옥의 몸체에 조건부 클래스 지정

기본 템플릿 파일이 layout.jade이고이 템플릿을 확장하는 파일 묶음이 있다고 가정하십시오 (home, about, products 등). 기본 템플릿에서옥의 몸체에 조건부 클래스 지정

나는 다음과 같은 구조를 넣어 :

body 
     section.main-content 
      block content

페이지 :

extends ../layouts/default 
    block content 
     include partials/banner 
     include partials/why

그래서 다른 페이지가 따라 콘텐츠 블록에 다른 콘텐츠를 넣어. 내가 gulp-jade와 페이지를 렌더링하고 결국 HTML로 모든 페이지가 있습니다.

내 질문에 - about과 같은 하위 페이지 내부에 변수를 넣어 부모 서식 파일의 본문 태그 클래스로 이동할 수 있습니까? <body class="about">?

다음은 이러한 상황에서 사용하는 패턴입니다.

//layouts/default.jade 
- var bodyClass; 
block variables 
html 
    head 
    body(class=bodyClass) 
    section.main-content 
     block content

이 그런 다음 페이지 템플릿에서 bodyClass을 설정 : 기본 템플릿에서 몇 가지 변수를 설정합니다. 내가 예를 들어, <head><title> 태그에 내 페이지 제목을 어떻게

//about.jade 
extends ../layouts/default 
block variables 
    - bodyClass = "about" 
block content 
    h1 This is the About Page

이입니다. 나는 또한 layout.jade 파일에 기본값을 제공하는 논리를 가질 수 있습니다.

2014-05-12 13:47:56

간단한 해결책을 가져 주셔서 감사합니다! –

답변