为什么我的 Octane 组件方法中会出现 'this is undefined'？

Question

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

这是我的组件模板：

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

这里是组件的 JavaScript class:

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)
  }
}

动作装饰器将组件上下文绑定到方法。这在 API docs for action.

中有更详细的描述

为什么我的 Octane 组件方法中会出现 'this is undefined'？

Why do I get 'this is undefined' in my Octane component methods?

ember.js

ember.js-3

ember-octane