我正在开发ember应用程序,我希望在注册页面和登录页面上有白色背景,其余页面应该有灰色背景。
目前我正在更改控制器(application.js文件)中的body标签颜色
import Ember from 'ember';
export default Ember.Controller.extend({
isVerified:false,
bgColour: function(){
if(['users.login','users.signup'].indexOf(this.get('currentPath')) != -1){
return 'white';
}
else{
return 'bg-grey';
}
}.property('currentPath'),
});
如何建议如何更好/更清洁?
答案 0 :(得分:3)
Kit的答案非常普遍,我们的应用程序也是如此。但是如果你真的只需要它来进行背景更改,你可以通过避免生成类名来简化它:
export default Ember.Route.extend({
activate () {
Ember.$('body').addClass('bg-white');
},
deactivate () {
Ember.$('body').removeClass('bg-white');
}
});
答案 1 :(得分:0)
我们必须处理来自客户的大量任意请求,其中最简单的方法是定位特定页面,因此我们将路由名称添加到body
。
Ember.Route.reopen({
activate: function() {
var cssClass = this.toCssClass();
// you probably don't need the application class
// to be added to the body
if (cssClass != 'application') {
Ember.$('body').addClass(cssClass);
}
},
deactivate: function() {
Ember.$('body').removeClass(this.toCssClass());
},
toCssClass: function() {
return this.routeName.replace(/\./g, '-').dasherize();
}
});
那说它很脏,你可以创建一个ThemeMixin
并在路线上设置它。这是一个更简单的版本:https://github.com/ronco/ember-cli-meta-tags