使用init:ember.js时，this.get（…）.then不是函数

我在我的组件中使用init（）来加载一些数据以进行下拉。刷新时，它可以工作，但当我将该选项卡保留到另一个选项卡，然后返回时，我会出现以下错误： index.js:143322未捕获类型错误：this.get（…）。then不是函数

这段代码在我的init函数中，我怀疑它与ember.js的渲染方式有关，但我正在努力找出如何使它工作。我试着使用其他的生活方式挂钩，但都不起作用

这是组件中的init函数：

init() {
      this._super(...arguments)
      this.get('popularTags').then(function(result) {
        const newArray = []
        for (var i = 0; i < result.length; i++) {
          newArray.push({
            name: result[i],
            value: result[i],
            group: 'Popular'
          })
        }
        const popularTags = this.get('popularTags')
        this.set('popularTags', newArray)
        this.get('queryResults').then(function(result) {
          const tagArray = []
          for (var i = 0; i < result.length; i++) {
            let popular = newArray.filter(tag => tag['value'] === result[i].value)

            if (popular.length === 0) {
              tagArray.push({
                name: result[i].value,
                value: result[i].value,
                group: ''
              })
            }
          }
          const queryResults = this.get('queryResults')

          return this.set('queryResults', tagArray)
        }.bind(this))

      }.bind(this))


    },

init（）{
这个._super（…参数）
this.get（'popularTags'）。然后（函数（结果）{
常量newArray=[]
对于（变量i=0；itag['value']==result[i].value）
if（popular.length==0）{
tagArray.push({
名称：结果[i]。值，
值：结果[i]。值，
组：“”
})
}
}
const queryResults=this.get（'queryResults'）
返回此.set（'queryResults'，tagArray）
}.绑定（本）
}.绑定（本）
},

关于您上面的示例，我有点不明白。您似乎正在获取和设置

popularTags

和

queryResults

属性。我不确定这是否只是您示例中的一个问题或其他问题-我将假设这是一个示例问题，并将其更一般地分解：

在

init

中做这么多的工作通常不是一个好主意，以至于计划从即将到来的glimmer组件API中删除它。特别是，当组件从DOM中删除时，任何生命周期挂钩中的

set

都会导致奇怪的错误。虽然您可以使用像

ember concurrency

这样的工具来帮助分解并处理

set

问题，但我的建议是将其分解为几个计算属性。这可能看起来像：

import Component from '@ember/component';
import { computed } from '@ember/object';

export default Component.extend({
  popularTags: computed('tags.[]', function(){
    return this.tags.filter(tag => tag.isPopular);
  }),
  queryResults: computed('popularTags.[]', function(){
    return this.popularTags.map(tag => {
      return {
        name: tag.name,
        value: tag.description
      };
    });
  }),
});

这些是在Ember中表示数据转换的方法。它们依赖于传递到组件中的一些初始数据，然后对其进行修改以供使用。在我上面的示例中，我假设

标记

被传入，但是您可以看到

查询结果

依赖于

popularTags

的结果，通过这种方式，可以按顺序执行多个不同的数据转换

---

当您第一次构建Ember.js应用程序时，虽然在组件中加载异步数据可以很好地工作，但我建议您将所有数据加载限制在，因为它更适合异步工作，然后将为您提供可以直接传递到组件中的数据，而无需担心加载过程中的困难在那里加载。

关于上面的示例，我不太明白。您似乎正在获取和设置

popularTags

和

queryResults

属性。我不确定这是否只是您示例中的一个问题或其他问题-我将假设这是一个示例问题，并将其更一般地分解：

在

init

中做这么多的工作通常不是一个好主意，以至于计划从即将到来的glimmer组件API中删除它。特别是，当组件从DOM中删除时，任何生命周期挂钩中的

set

都会导致奇怪的错误。虽然您可以使用像

ember concurrency

这样的工具来帮助分解并处理

set

问题，但我的建议是将其分解为几个计算属性。这可能看起来像：

import Component from '@ember/component';
import { computed } from '@ember/object';

export default Component.extend({
  popularTags: computed('tags.[]', function(){
    return this.tags.filter(tag => tag.isPopular);
  }),
  queryResults: computed('popularTags.[]', function(){
    return this.popularTags.map(tag => {
      return {
        name: tag.name,
        value: tag.description
      };
    });
  }),
});

这些是在Ember中表示数据转换的方法。它们依赖于传递到组件中的一些初始数据，然后对其进行修改以供使用。在我上面的示例中，我假设

标记

被传入，但是您可以看到

查询结果

依赖于

popularTags

的结果，通过这种方式，可以按顺序执行多个不同的数据转换

---

当您第一次构建Ember.js应用程序时，虽然在组件中加载异步数据可以很好地工作，但我建议您将所有数据加载限制在，因为它更适合异步工作，然后将为您提供可以直接传递到组件中的数据，而无需担心加载过程中的困难正在加载它。

您的问题可能是使用卷曲调用组件并传递

popularTags

：

{{您的组件popularTags=something}}

这是双向的。这恰恰意味着在组件内部更改

popularTags

将更改调用方的

内容

这意味着，如果您删除此组件并在以后重新创建它（您提到的某些选项卡表明），您将在外部更改
某些内容。您的组件期望
popularTags
（因此
something
）成为承诺（当调用
this.get（'popularTags'）。然后
）。但是，因为您更改了它（使用
this.set（'popularTags'，newArray）
），它不再是一个承诺，而是一个数组

一般来说，我建议您在更改传递的属性时要小心。
您的问题可能是使用卷发调用组件并传递
popularTags
：

{{您的组件popularTags=something}}

这是双向的。正是这意味着