这是我的routes/index.js:
var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
res.render('index');
});
module.exports = router;
这是我的index.jade:
extends layout
block content
block top-menu
这是我的layout.jade:
doctype html
html
head
title The Outpost
meta(charset='utf-8')
meta(name='viewport', content='width=device-width, initial-scale=1.0')
link(href='stylesheets/style.css', rel='stylesheet')
link(href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css", rel="stylesheet")
link(href='https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css', rel='stylesheet')
body
block content
block top-menu
这是我的顶级菜单.jade:
extends index
block top-menu
<!-- menu -->
使用 res.render('index');
时如何显示菜单?还是我对 Jade 传承的理解有误?
我使用此网站是为了了解:http://www.learnjade.com/tour/template-inheritance/
最佳答案
实际上,您必须使用 res.render('top-menu')
才能使其按照您的设置工作。我建议使用 include
将顶部菜单引入您的布局中。
doctype html
html
head
title The Outpost
meta(charset='utf-8')
meta(name='viewport', content='width=device-width, initial-scale=1.0')
link(href='stylesheets/style.css', rel='stylesheet')
link(href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css", rel="stylesheet")
link(href='https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css', rel='stylesheet')
body
block content
include top-menu
注意:如果您希望顶部菜单实际显示在内容上方,则需要将其移动到内容上方。
然后,您不必扩展顶部菜单中的任何内容,也不必声明要覆盖的 block ,因为它只会包含在布局中。
<!-- top-menu.jade -->
<ul>...</ul>
关于html - 我的 index.js 路由文件出现问题 - 我是否正确设置了 View ?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31837578/