在Ember.JS应用程序的不同样式之间进行选择
在Ember.JS应用程序的不同样式之间进行选择
提问于 2017-09-28 13:14:41
我遇到的问题是，我找不到一种方法来“改变”我的应用程序中的css样式。
例如，我想要访问的东西是:我有一个红色主题，但我希望用户可以选择另一个预定义的主题，比如绿色或蓝色主题。
我的想法是，我有不同的app.css，我如何在彼此之间改变，我找不到方法这样做。也许我可以在我的environnement.js里做
任何小费都会被接受。
tl;dr：如何在我们的Ember.JS应用程序中设置多个css样式？
Stack Overflow用户
回答已采纳
发布于 2017-10-07 14:55:50
您可以通过生成多个样式表来实现这一点，请参阅：https://ember-cli.com/asset-compilation#configuring-output-paths
我建议使用烬-cli头添加一个带有附加主题样式表的特定链接元素。可以使用head.hbs服务在headData中设置样式表。
完整的例子：
ember-cli-build.js
var app = new EmberApp({
outputPaths: {
app: {
css: {
// app/styles/red.css
'red': '/assets/themes/red.css'
}
}
},
// Exclude theme css files from fingerprinting,
// otherwise your file is named `red-somehash.css`
// which we don't (easily) now at runtime.
fingerprint: {
exclude: [ 'red.css' ]
}
})head.hbs
{{#if theme}}
<link rel="stylesheet" href="/assets/{{theme}}.css">
{{/if}}some-component.js (或路线或其他)
export default Ember.Component.extend({
headData: Ember.inject.service(),
actions: {
setTheme(themeName) {
this.set('headData.theme')
}
}
})页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/46470121
复制相关文章
相似问题
腾讯云开发者
