Question

我的标头有一个jade模板文件，并使用bootstrap标记。根据用户所在的页面，导航栏需要将class .active添加到该导航项。避免这样的长代码的最佳方法是什么。

header.jade

if nav=='home'
   li.active
      a(href="/") Home
else
   li
      a(href='/') Home
if nav=='about'
   li.active
      a(href='/about') About
else
   li
      a(href='/about') About

路线

router.get('/about', function(req, res) {
   res.render('about', { nav:'about' });
});

注意如果标题中有更多链接，它会变得更长。是否有更好的方法来添加课程“活跃”？到正在浏览的页面？

由于泰勒

Answer 1

您可以创建一个处理列表项呈现的mixin。这样就不必重复逻辑代码了：

mixin header-item(name, url)
  if name.toLowerCase() == nav
    li.active
      a(href=url)= name
  else
    li
      a(href=url)= name

+header-item('Home', '/')
+header-item('About', '/about')

jade模板条件类nodejs expressjs

1 个答案: