【问题标题】:When in Aurelia lifecycle should I populate component properties?我应该在 Aurelia 生命周期中何时填充组件属性?
【发布时间】:2016-12-03 04:58:37
【问题描述】:

我有一个 Aurelia 组件,它有一些我想从 API 调用初始化的属性(项目列表)。该项目列表最终将显示在 select 元素中。虽然该列表为空,但我可以显示一个空的 select(或禁用它)。

我的问题是,我应该什么时候在component lifecycle 中填充项目列表?我见过这个answer 建议attached。但我在想,因为它并不真正依赖于被附加或绑定的组件,所以我会在构造函数中这样做。

有什么优点、缺点和影响?

component.js

@inject(WebApi)
export class MyComponent {

  api = undefined;
  items = undefined;

  /**
   * Creates the component
   * @param api the web API
   */
  constructor(api) {
    this.api = api;
    this.api.getItems().then(items => {
      this.items = items;
    });
  }
}

component.html

<template>
  <div>
    <select value.two-way="selectedItem">
      <option repeat.for="item of items" model.bind="item">${item.id}</option>
    </select>
  </div>
</template>

【问题讨论】:

    标签: javascript aurelia lifecycle


    【解决方案1】:

    作为一般建议,我不会在构造函数中这样做。这适用于您编写的任何代码,无论框架或语言如何。构造函数应该做最少的工作来建立一个对象然后返回。当然,你在这里使用了一个 Promise,所以构造函数仍然会很快完成,所以有一个参数 make 在这里没问题。

    话说回来……

    您将使用的回调将取决于用例。对于路由器未加载的组件,您有三个选择:createdbindattached。在您的用例中,您可以在加载数据之前禁用选择元素,因此使用attached 回调很好。我个人可能会把这个电话放在这里。

    如果在数据绑定之前需要数据,我会使用created 回调。如果要检索的数据需要通过数据绑定接收的参数,我将使用bind 回调。

    【讨论】:

    • 感谢您的回复!一个问题,如果我在attached 中返回承诺,那会不会因为 Aurelia 现在正在等待响应附加到 DOM 而减慢速度?如果我在 attached 中进行 API 调用但不返回承诺会怎样?
    • 如果你不兑现承诺,那么 Aurelia 就会继续前进。这是一件好事,因为您可以选择等待或不等待。
    • 嗯,我似乎找不到任何有关返回承诺的文档。当我在我的代码中尝试它时,元素会被附加,而无需等待我返回的承诺解决。
    • 在附加元素后调用attached 回调(因此回调名称中的过去时)。
    • 哦,我明白了,当然!此外,我认为 Aurelia 不会对生命周期回调中返回的承诺做任何事情:github.com/aurelia/framework/issues/367。您必须使用CompositionTransaction
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-04-21
    • 2017-12-18
    • 2018-06-14
    相关资源
    最近更新 更多