ember.js 什么是正确的方式转换观察员到辛烷版本的ember？

jmo0nnb3 于 2022-11-05 发布在其他

关注(0)|答案(1)|浏览(173)

我试着把我所有的ember组件转换成辛烷版本。但是我有一个更大的疑问。我怎样才能把observer代码转换成辛烷版本呢？例如，

parent.hbs

 <Child @value={{this.value}} />

child.hbs

 <div>{{this.newUpdate}}</div>

child.js

  export default class ChildComponent extends Component {     
      /**Previous code: sample code only
        valueUpdate: observer('value', function() {
            this.newValue = this.value / 12 * 2;
        })
      */
  }

我如何更新观察器到辛烷的方式？任何想法，请...

***注意：***我尝试使用'@observer'，但它在组件内不起作用。

ember.js

来源：https://stackoverflow.com/questions/65477788/what-is-the-correct-way-to-convert-observer-to-octane-version-of-ember

1条答案

按热度按时间

ni65a41a1#

Ember Octane在这方面遵循了另一种编程模型。与其观察一个属性并在它改变时更新另一个属性，不如使用本机getter来派生状态。

import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';

export default class ChildComponent extends Component {
  // I assume that value is a local state of this component.
  // If it's an argument passed to the component on invocation.
  // You don't need to declare it here but can reference
  // this.args.value directly in the getter.
  @tracked value;

  get newValue() {
    return this.value / 12 * 2;
  }
}

只要值是从跟踪的属性派生的，模板就会在其更改时重新呈现。无需使用观察器手动更新值，也无需像处理计算属性那样显式列出依赖项。
传递给组件的参数是自动跟踪的。因此，如果value不是本地状态，而是作为参数传递的，那么就像下面这样简单：

import Component from '@glimmer/component';

export default class ChildComponent extends Component {
  get newValue() {
    return this.args.value / 12 * 2;
  }
}

赞(0）回复(0）举报 2022-11-05

我来回答

ember.js 什么是正确的方式转换观察员到辛烷版本的ember？

1条答案

相关问题

热门标签

最新问答