Add Event Handling guide for Vue.js (#24176)
This commit is contained in:
committed by
Randell Dawson
parent
f94879daa9
commit
ca29fb664e
25
guide/english/vue/event-handling/index.md
Normal file
25
guide/english/vue/event-handling/index.md
Normal file
@ -0,0 +1,25 @@
|
||||
---
|
||||
title: Event Handling
|
||||
---
|
||||
|
||||
## Creating an Event
|
||||
We can create an event using the directive `v-on`:
|
||||
|
||||
```html
|
||||
<div id="app">
|
||||
<button v-on:click="buttonClicked">Click Me</button>
|
||||
</div>
|
||||
```
|
||||
|
||||
```javascript
|
||||
var app = new Vue({
|
||||
el: '#app',
|
||||
methods: {
|
||||
buttonClicked: function (event) {
|
||||
alert("You clicked on a " + event.target.tagName + " element");
|
||||
}
|
||||
}
|
||||
})
|
||||
```
|
||||
|
||||
Note: A shorthand for any event handler is using the `@` symbol and the event name. For example `@click` is short for `v-on:click`.
|
Reference in New Issue
Block a user