ember.js - 我们不能在 glimmer 组件 getter 中放置一个 ember 并发任务，它正在跟踪组件参数

Question

-- 当一个 ember 并发任务被称为 glimmer components getter 时，它会无限循环运行。

import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';
import { inject as service } from '@ember/service';
import { task } from 'ember-concurrency';

export default class UserTableComponent extends Component {
  @service store;
  @tracked users;

  get taskStatus() {
    let params = {
      'account_id':this.args.account,
      'page':this.args.page
    }
    this.getUsersTask.perform(params);

  }


  @task(function*(params) {
      let recordsWithMeta = yield this.store.query('user', params);
      this.users= recordsWithMeta.toArray();
    }) getUsersTask;

}

用户表.hbs

<table>
  <thead>
    <tr>
      <th>
        <div class="first">Name</div>
      </th>
    </tr>
  </thead>
  <tbody>
    {{#if this.taskStatus.isRunning}}
    <tr>
      <td >
        <div class="h-64">
          {{ui-kit/loader}}
        </div>
      </td>
    </tr>
    {{else}}
    {{#each @users as |user|}}

    {{/each}}
    {{/if}}
  </tbody>
</table>

上面的组件在模板中的某处被调用并传递帐户和页面动态。

<UserTable 
  @account={{this.account}}
  @page={{this.page}}
  >          
</UserTable>

注意：它在无限循环中运行。

Answer 1

我发现有两件事要改变。但不确定它们是否足以让它发挥作用。

第一点，

{{#each @users as |user|}}相当于this.args.users。但是users数组是在组件上定义的。所以必须改成{{#each this.users as |user|}}

第二点，

taskStatus不返回任何东西。每次都会{{#if this.taskStatus.isRunning}}如此。false正确的检查是{{#if this.getUsersTask.isRunning}}, 因为isRunning是任务的一个属性。
但是当你改成{{#if this.getUsersTask.isRunning}}之后，由于没有人触发，它就不起作用了getUserTask。我认为您可以在生命周期挂钩之一（例如didInsertElement）中启动该任务。