子組件：發出事件
<template>
<div>
<button @click="count(1)">+</button>//點擊調用本身定義的count方法，傳入參數1
</div>
</template>
<script>
export default ({
data:function(){
},
methods:{
count(data){
this.$emit('countEvent',data);//調用父組件的countEvent事件，將data變量作為參數傳入
}
}
})
</script>
<style scoped>
</style>
父組件：接收事件
<template>
<div>
{{count}}//顯示變量count到頁面上
<HelloWorld @countEvent="countFun"></HelloWorld>//定義countEvent事件，將事件綁定到自己的方法countFun上
</div>
</template>
<script>
import HelloWorld from './component/HelloWorld'
export default {
name:"App",
data:function(){
return {
count:1//定義count變量，初始值為1
};
},
components:{
HelloWorld
},
computed:{
},
methods:{
countFun(data){//子組件發出事件后，父組件的這個事件綁定到了countFun方法，相當於子組件調用了父組件的countFun方法並出入參數
this.count = this.count+data;//在方法中根據子組件傳入的值改變父組件定義的count變量
}
}
}
</script>
<style scoped>
</style>