ember.js - 为什么在我的 Octane 组件方法中得到 'this is undefined'？

Question

我正在 Ember v3.13 中编写一些 Octane 风格的组件，连同 {{did-insert}} ember-render-modifier .但是，当调用绑定(bind)到 did-insert 的函数时，我得到 TypeError: this is undefined。我做错了什么？

这是我的组件模板:

<div class="cardhost-monaco-container" {{did-insert this.renderEditor}}></div>

这是组件的 JavaScript 类:

import Component from '@glimmer/component';


export default class CodeEditor extends Component {
  renderEditor(el) {
    console.log(this.args.code)
  }
}

Answer 1

在模板中用作操作的方法需要用 @action 修饰以具有正确的 this-context:

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

export default class CodeEditor extends Component {
  @action
  renderEditor(el) {
    console.log(this.args.code)
  }
}

Action 装饰器将组件上下文绑定(bind)到方法。这在 API docs for action 中有更详细的描述。 .