3

我使用 Express 3x + Jade + bootstrap +..etc

我的块/扩展结构看起来像这样

.layout.jade（仅头部内容）
.topNav.jade（仅顶部导航）
.sideNav.jade（sideNav 和控制中心界面）
.slidePrem.jade（实际内容）

现在我尝试重新渲染 slidePrem

-> 这会渲染 sidenav、topnav、布局（因此“extends”语句是从 slideprem 中读出的）

但它不会显示 slidePrem 的任何内容

所以经过许多小时的重新编码、搜索、重新设计等
。我将结构重写为 slideprem -> sidenav -> 布局

-> 这会渲染 slideprem、sidenav、布局

->>> 那么嵌套块实际上有限制吗？
-> 可以编辑吗？
-> 或者 cld 你想象其他地方的错误？

关于鼠兔

编辑：

//slidePrem.jade//

extends ../sideNav
block wall
    #bla (or alert or sth)


//sideNav.jade//

extends topNav
block content
#subHeader
#subHeadNav
#Content //doesnt conflict with "block content" 
    div.container
        div.row
            div.span9
                block wall
            div.span3
                                    // further code



//topNav.jade//

extends layout
block navigation
    div.topnav.....
        div...
            ...
    block content
    #modal


//layout.jade//

doctype 5
html
head
    title= title
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    link(rel='stylesheet', href='http://fonts.googleapis.com/css?family=Titillium+Web&subset=latin,latin-ext', type='text/css')
    link(rel='stylesheet', href='/bootstrap/css/bootstrap.min.css')
    link(rel='stylesheet', href='/bootstrap/css/bootstrap-responsive.min.css', media="screen")
    link(rel='stylesheet', href='/stylesheets/style.css')
    link(rel='stylesheet', href='/stylesheets/cCenter.css')

    script(src='/javascripts/jq.js')
    script(src='/bootstrap/js/bootstrap.min.js')
    script(src='/javascripts/core.js')
    script(src='/javascripts/ajax.js')
body
    block navigation
4

1 回答 1

2

您应该尝试使用include而不是extends。

所以你可以试试你的 layout.jade ：

html
  head
  (...)
  body
    block navigation

在您的 navigation.jade 块中

extends layout

block navigation
  .topnav (div aren't required in jade)
  (...)
  include content

你的 content.jade 只需要那么

#subHeader
#subHeadNav
#Content //doesnt conflict with "block content" 
 div.container
   div.row
      div.span9
        include wall
      div.span3

如果这还不够清楚，您可以在项目的 GitHub 页面上找到所有包含文档。

我希望它会有所帮助。

于 2013-05-24T20:03:03.743 回答