在值函数中用于项的自引用

Question

如何使用value在函数中引用元素本身?

我的意思是:

<div id="foo" onClick="clickFunction(this.id)"></div>

Javascript:

function clickFunction(e){
console.log(e) // foo
}

Answer 1

使用event.target.id

<div id="foo" @click="clickFunction($event)"></div>

和

clickFunction(event){
alert(event.target.id)
}

const App = {
methods: {
clickFunction(event){
alert(event.target.id)
}
}
}
Vue.createApp(App).mount('#app')

#app { line-height: 1.75; }
[v-cloak] { display: none; }

<div id="app" v-cloak>
<button id="foo" @click="clickFunction($event)">Click Me!</button>
</div>
<script src="https://unpkg.com/vue@3/dist/vue.global.prod.js"></script>