CreateEvent在Vue中的應用

在Vue中，可以使用$emit方法來觸發事件，從而在父組件中監聽并處理該事件。以下是一個簡單的示例：

<!-- ChildComponent.vue -->
<template>
  <button @click="handleClick">Click me</button>
</template>

<script>
export default {
  methods: {
    handleClick() {
      this.$emit('custom-event', 'Hello from child component');
    }
  }
}
</script>

<!-- ParentComponent.vue -->
<template>
  <div>
    <ChildComponent @custom-event="handleCustomEvent" />
    <p>{{ message }}</p>
  </div>
</template>

<script>
import ChildComponent from './ChildComponent.vue';

export default {
  components: {
    ChildComponent
  },
  data() {
    return {
      message: ''
    };
  },
  methods: {
    handleCustomEvent(data) {
      this.message = data;
    }
  }
}
</script>

在上面的代碼中，子組件ChildComponent中的按鈕被點擊時，會觸發handleClick方法，然后使用$emit方法觸發名為custom-event的自定義事件，并傳遞一個字符串參數。在父組件ParentComponent中，監聽了子組件的custom-event事件，并調用handleCustomEvent方法來處理事件傳遞的參數。最終會在頁面上顯示出Hello from child component。

這就是在Vue中通過$emit和自定義事件來實現組件間通信的基本方法。