Vue的event屬性是一個對象,其作用是在組件之間進行通信。event屬性可以通過父組件傳遞下來,在子組件中監聽并響應特定事件。以下是一個簡單的示例:
// 父組件
<template>
<div>
<Child @customEvent="doSomething"></Child>
</div>
</template>
<script>
import Child from './Child.vue'
export default {
components: {
Child
},
methods: {
doSomething(data) {
console.log(data)
}
}
}
</script>
// 子組件
<template>
<div>
<button @click="emitCustomEvent">click me</button>
</div>
</template>
<script>
export default {
methods: {
emitCustomEvent() {
this.$emit('customEvent', 'hello world')
}
}
}
</script>
在這個示例中,父組件傳遞了一個自定義事件customEvent給子組件,子組件監聽這個事件,當按鈕被點擊時通過$emit方法將一個字符串 'hello world' 發送到父組件中,父組件收到這個消息后將其打印在控制臺中。
需要注意的是,若子組件中不存在對應的事件監聽器,那么子組件將無法通過$emit方法將事件傳遞到父組件中。使用event屬性的好處在于,它可以使父子組件之間解耦,子組件可以發送自定義事件而不需要知道父組件具體做了什么。
上一篇python 泛型函數
下一篇vue全局注冊變量