how to manage the key press and blur with input id in vue js

Here is what the above code is Doing:
1. `v-on:keyup.enter` is a directive that listens to the `keyup` event.
2. `.enter` is a modifier that only fires the `submit` method when the key is `Enter`.

### Key Modifiers

Vue provides a number of key modifiers that can be used to trigger events only when certain keys are pressed.

| Modifier | Description |
|———-|————-|
| .enter | Only trigger handler if `Enter` key is pressed |
| .tab | Only trigger handler if `Tab` key is pressed |
| .delete (or .del) | Only trigger handler if `Delete` key is pressed |
| .esc | Only trigger handler if `Escape` key is pressed |
| .space | Only trigger handler if `Space` key is pressed |
| .up | Only trigger handler if `Up` key is pressed |
| .down | Only trigger handler if `Down` key is pressed |
| .left | Only trigger handler if `Left` key is pressed |
| .right | Only trigger handler if `Right` key is pressed |
| .ctrl | Only trigger handler if `Ctrl` key is pressed |
| .alt | Only trigger handler if `Alt` key is pressed |
| .shift | Only trigger handler if `Shift` key is pressed |
| .meta | Only trigger handler if `Meta` key is pressed |
| .exact | Only trigger handler if event.target is exactly `` element |

### System Modifiers

Vue also provides a number of system modifiers that can be used to trigger events only when certain system events occur.

| Modifier | Description |
|———-|————-|
| .stop | Calls `event.stopPropagation()` on the wrapped event |
| .prevent | Calls `event.preventDefault()` on the wrapped event |
| .capture | Adds `eventListener` in capture mode |
| .self | Only trigger handler if `event.target` is the element itself |
| .once | Only trigger handler once |

### Mouse Button Modifiers

Vue also provides a number of mouse button modifiers that can be used to trigger events only when certain mouse buttons are pressed.

| Modifier | Description |
|———-|————-|
| .left | Only trigger handler if `Left` mouse button is pressed |
| .right | Only trigger handler if `Right` mouse button is pressed |
| .middle | Only trigger handler if `Middle` mouse button is pressed |

### Key Codes

Vue also provides a number of key codes that can be used to trigger events only when certain keys are pressed.

| Key Code | Description |
|———-|————-|
| 13 | `Enter` |
| 27 | `Escape` |
| 32 | `Space` |
| 37 | `Left` |
| 38 | `Up` |
| 39 | `Right` |
| 40 | `Down` |

## Event Modifiers

Event modifiers are used to modify the behavior of an event.

### Prevent Default

The `.prevent` modifier is used to prevent the default behavior of an event.

For example, the following code prevents the default behavior of the `submit` event:

“`html

…

“`

### Stop Propagation

The `.stop` modifier is used to stop the event from propagating to parent elements.

For example, the following code stops the event from propagating to parent elements:

“`html