我使用Ember.Service作为长期 Ember 对象,因为我需要它在我的应用程序的不同部分中可用。
import Ember from 'ember';
export default Ember.Service.extend({
user:null,
updateActiveUser(user){
this.set('user',user);
},
getActiveUser(){
const user=this.get('user');
if(user){
return user;
}else{
return null;
}
}
});
在我的组件上,我以这种方式要求该用户:
从“ember”导入Ember;
export default Ember.Component.extend({
activeUser:Ember.inject.service('active-user'),
list: [],
selectedUser:null,
didReceiveAttrs() {
this._super();
this.set('list',this.get('model'));
const active=this.get('activeUser').getActiveUser();
if(active){
this.set('selectedUser',active);
}else{
this.set('selectedUser',this.get('model').objectAt(0));
}
},
actions:{
selectUser(user){
this.set('selectedUser',user);
this.get('activeUser').updateActiveUser(user);
}
}
});
我的问题是,在选择一个用户然后重新加载页面后,该页面没有保存最后选择的用户,并且该页面显示的是默认用户。
最佳答案
(在问题稍有改变后进行了编辑)
您正在尝试使应用程序状态即使在刷新页面后仍可保留在客户端的浏览器中。
我认为您应该研究使用localStorage。
在您的服务中执行以下操作:
import Ember from 'ember';
export default Ember.Service.extend({
user: null,
updateActiveUser(user){
this.set('user', user);
// persist the user's browser so it can be retrieved on reload
localStorage.setItem('user', JSON.stringify(user));
},
getActiveUser(){
var user = this.get('user');
if (user) {
return user;
} else {
// try to get the user from localStorage
var foundUser = JSON.parse(localStorage.user);
if (foundUser) {
this.set('user', foundUser);
return foundUser;
} else {
return null;
}
}
}
});
最后,为什么要使用
const
?如果您永远不会更改变量,则应使用该变量。但是,似乎用户定期更改。如果更改标记为的变量const ,则ES6应该引发异常。 const - MDN