✅ The "extends": "plugin:ember/recommended"
property in a configuration file enables this rule.
Disallows the actions hash in components and controllers.
Ember Octane includes a rethink of event handling in Ember. The actions
hash and {{action}}
modifier and helper are no longer needed. To provide the correct context to functions (binding), you should now use the @action
decorator. In templates, the {{on}}
modifier can be used to set up event handlers and the {{fn}}
helper can be used for partial application.
Use the @action
decorator or foo: action(function() {}))
syntax instead of an actions
hash.
Examples of incorrect code for this rule:
// Bad, with classic class
import Component from '@ember/component';
export default Component.extend({
actions: {
foo() {}
}
});
// Bad, with native class
import Component from '@ember/component';
export class MyComponent extends Component {
actions = {
foo() {}
};
}
Examples of correct code for this rule:
// Good, with classic class
import Component from '@ember/component';
import { action } from '@ember/object';
export default Component.extend({
foo: action(function () {})
});
// Good, with native class
import Component from '@ember/component';
import { action } from '@ember/object';
export class MyComponent extends Component {
@action
foo() {}
}