Question

您认为哪个生命周期最适合在store中加载Ember.Component数据？

我正在异步加载数据。这就是为什么我没有加载来自route的真实数据，而是它的元数据？

例如。我正在加载基于作者name的书籍列表和publisher列表。（这只是一个例子）。

我得到了一份作者列表和一份发布商列表。

代码：

import Ember from 'ember';

export default Ember.Route.extend({
  model(params) {
    return Ember.RSVP.hash({
      authors: this.store.findAll('author'),
      publishers: this.store.findAll('publisher')
    });
  }
})

从authors获取publishers和route后，现在我们可以再进行一次查询，即this.store.find('book', {author, publisher})来获取图书。

我只是想问一下Ember.Component中哪个生命周期更适合异步获取这些数据。

更新

这个问题可以通过以下3种方式加载逻辑来解决：

setupController内的route。
model()

route

在组件生命周期中。

经过考虑（与同事一起阅读和讨论），我认为组件应该是结果，而不是逻辑。请参阅下面的答案。

Answer 1

init()挂钩是您要进行数据请求的位置。

import Component from 'ember-component';
import injectService from 'ember-service/inject';

export default Component.extend({
  store: injectService(),

  posts: [],

  init(){
    this._super(...arguments);

    this._getPosts();
  },

  _getPosts() {
    this.get('store').findAll('post').then((posts) => {

      // because this is async you need to guard against the component 
      // being destroyed before the api call has finished because 
      // because `this.set` will throw an error.
      if (this.isDestroyed) { return; } 

      this.set('posts', posts);
  }
});

Answer 2

我能够连锁它。

import Ember from 'ember';

export default Ember.Route.extend({
  model(params) {
    return Ember.RSVP.hash({
      m1s: this.store.findAll('meta1'),
      m2s: this.store.findAll('meta2')
    }).then( ({m1, m2}) => {

      let data = [];
      m1s.forEach( (m1) => {
        m2s.forEach( (m2) => {    
          this.store.query('modelName', {
              m1.get('id'),
              m2.get('id')
          });

        });

      });

    });
  }
}),

您可能需要编写自己的adapter和serializer。

Ember组件加载商店数据

2 个答案: