Question

我使用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;

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);

    }
}
});

我的问题是，在我选择一个用户然后重新加载页面时，没有保存最后选择的用户并显示默认用户。

Answer 1

（问题稍有改动后编辑）

即使在页面刷新后，您也试图让应用状态在客户端的浏览器中保留。

我认为你应该考虑使用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

Answer 2

您没有在代码中为用户分配未定义的变量

updateActiveUser(user){
  this.set('user',kid); 
}

应为this.set('user', user);

<强>更新

问题在于，Ember服务不会通过页面重新加载，因为所有JS都被丢弃并重新加载（包括您的应用程序）。

您可以将服务中的数据存储在浏览器本地存储或类似内容中。

重新加载后遗骸服务丢失

2 个答案: