我有三个 css 文件,我只想将它们加载到特定页面或模板上。如何在 Meteor 中完成此操作。我已经尝试在创建模板时将 css 文件附加到头部区域,但这不起作用,因为当我离开此页面时,这些文件仍处于加载状态。
最佳答案
我用一个非常简单的自定义布局解决了这个问题,它在第一个 div 中添加了模板的名称。在您的主模板上:
<head>
<title>Your title</title>
...
</head>
<template name="layout">
<div class="container-fluid {{template}}">
<header>
<h1>Testing</h1>
...
</header>
<div class="row">
...
</div>
</div>
</template>
添加以下模板助手:
Template.layout.helpers({
template: function () {
route = Router.current();
return route? route.lookupTemplate() : 'home';
},
...
});
现在只需将模板的名称添加为根类,即可将您的 CSS 隔离到单个页面中,如下所示:
.templateName header h1 { color: red; }
.templateName div.row { max-height: 300px; }
...
最后,记得将 Iron Router 指向您的布局模板:
Router.configure({
layoutTemplate: 'layout',
...
});
关于css - 如何在 Meteor 中只加载一页的 css 文件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25777088/