Skip to content

Commit

Permalink
Prism happy?
Browse files Browse the repository at this point in the history
  • Loading branch information
NullVoxPopuli committed Mar 13, 2024
1 parent 39ca9bc commit ed72668
Showing 1 changed file with 14 additions and 14 deletions.
28 changes: 14 additions & 14 deletions content/ember/v5/deprecate-template-action.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,21 +7,21 @@ since: 5.10.0
### Scenario: `action` is passed a string

Before:
```hbs
```handlebars
<button type="button" {{action "plusOne"}}>
Click Me
</button>
```

After

```hbs
```handlebars
<button type="button" {{on 'click' this.plusOne}}>
Click Me
</button>
```
or, if `plusOne` is passed in as an argument
```hbs
```handlebars
<button type="button" {{on 'click' @plusOne}}>
Click Me
</button>
Expand All @@ -30,7 +30,7 @@ or, if `plusOne` is passed in as an argument
If the `plusOne` action is in an actions object, it needs to move out:

Before:
```js
```javascript
import Component from '@glimmer/component';

export default class Demo extends Component {
Expand All @@ -42,7 +42,7 @@ export default class Demo extends Component {
}
```
or
```js
```javascript
import Component from '@ember/component';

export default class Demo extends Component {
Expand All @@ -54,7 +54,7 @@ export default class Demo extends Component {
}
```
or
```js
```javascript
import Component from '@ember/component';

export default Component.extend({
Expand All @@ -67,7 +67,7 @@ export default Component.extend({
```

After:
```js
```javascript
import Component from '@glimmer/component';
import { action } from '@ember/object';

Expand All @@ -86,36 +86,36 @@ Note that `@action` is completely different from `(action)` or `{{action}}` (and
### Scenario: `action` is passed a function reference

Before:
```hbs
```handlebars
<SomeComponent @update={{action this.plusOne}} />
```

After

```hbs
```handlebars
<SomeComponent @update={{this.plusOne}} />
```

### Scenario: `action` is passed parameters

Before:
```hbs
```handlebars
<SomeComponent @update={{action this.plus 1}} />
```

After:
```hbs
```handlebars
<SomeComponent @update={{fn this.plus 1}} />
```

### Scenario: `action` is used with `mut`

Before:
```hbs
```handlebars
<SomeComponent @update={{action (mut @value.property}} />
```
After:
```js
```javascript
// parent.js
import Component from '@glimmer/component';
import { action } from '@ember/object';
Expand All @@ -127,7 +127,7 @@ export default class SomeComponent extends Component {
}
}
```
```hbs
```handlebars
{{! parent.hbs }}
<SomeComponent @update={{this.handleUpdate}} />
```
Expand Down

0 comments on commit ed72668

Please sign in to comment.