Skip to content

template-no-action.md

Latest commit

 

History

History
75 lines (55 loc) · 2.03 KB

template-no-action.md

File metadata and controls

75 lines (55 loc) · 2.03 KB

ember/template-no-action

💼 This rule is enabled in the 📋 template-lint-migration config.

Disallows the use of {{action}} helper.

The {{action}} helper is deprecated in favor of the {{on}} modifier and {{fn}} helper, which provide better performance and clearer intent.

Examples

Examples of incorrect code for this rule:

<template>
  <button {{on "click" (action "save")}}>Save</button>
</template>
<template>
  {{action "doSomething"}}
</template>

Examples of correct code for this rule:

<template>
  <button {{on "click" this.save}}>Save</button>
</template>
<template>
  <button {{on "click" (fn this.save "arg")}}>Save with arg</button>
</template>
<template>
  {{this.action}}
</template>
import action from './my-action-helper';
<template>
  {{action this.handleClick}}
</template>
<template>
  {{#each items as |action|}}
    <button {{action this.handleClick}}>x</button>
  {{/each}}
</template>

Strict-mode behavior

action is an ambient strict-mode keyword in Ember (registered in STRICT_MODE_KEYWORDS), so {{action this.x}} works in .gjs/.gts templates without an explicit import. The rule still flags those uses to discourage the deprecated keyword — but skips reports when action resolves to a JS-scope binding (an import or local declaration) or a template block param.

Migration

  • Replace (action "methodName") with method references or (fn this.methodName)
  • Replace <button onclick={{action ...}}> with <button {{on "click" ...}}>

References