基于页面URL的Jade条件语句？

Question

能否在我的布局模板中设置基于页面路径的jade条件语句？是否有一个页面路径变量？我想做这样的事情：

if page = "/about"
  link(rel='stylesheet', href='css/about')
else
  link(rel='stylesheet', href='css/main')

这是布局模板的一部分。我应该在哪里和如何定义变量来驱动它？

- user2022284

Answer 1

是的，这是可能的：

- var page = window.location.pathname

if page === "/about"
   link(rel='stylesheet', href='css/about.css')
else
   link(rel='stylesheet', href='css/main.css')

请注意，上述代码片段假设模板在浏览器环境中执行。如果不是这种情况，您可以使用您正在使用的语言获取路径名，并将其作为数据传递给模板。例如，如果您使用Express框架，则request对象的path属性返回URL的路径部分。

- Ram

---

此解决方案假设模板在浏览器中执行，而不是在服务器端执行。 - cspotcode

@cspotcode 是的，它确实可以。可能是因为我习惯于开发单页应用程序。我会进行更新。谢谢！ - Ram

我没有使用任何框架 - 这是为网站的几个静态页面。后端CMS是Craft，如果有帮助的话。所以不确定模板是否在浏览器中执行（顺便说一句，我不知道那是什么意思）。 - user2022284

@user2022284，“后端”意味着模板在服务器端而不是浏览器上执行。您应该使用您的“cms”（无论它是什么）获取路径并将其传递给模板。请参阅https://dev59.com/72Qm5IYBdhLWcg3w-jBL。 - Ram

Answer 2

我会在express中使用req.path动态设置路径：

res.locals.path = req.path;
res.render('about');

然后在Jade文件中使用路径：

if path === "/about/"
   link(rel='stylesheet', href='css/about.css')
else
   link(rel='stylesheet', href='css/main.css')

- NFpeter

Answer 3

取决于你的设置

在Express中：

res.locals.cssPath = 'css/about.css';
res.render('about');

Jade： 不确定这里的语法，因为我不使用jade，但你可以访问locals。

link(rel='stylesheet', href=cssPath)

- Molda