組件事件
在組件的模板表達式中，可以直接使用$emit方法觸發自定義事件
觸發自定義事件的目的是組件之間傳遞數據

我們來創建2個組件。父組件： ComponentEvent.vue,子組件：Child.vue

Child.vue

<script>
export default {// 子組件通過$emit觸發父組件的自定義事件并傳遞數據// someEvent為自定義事件名，"來自Child的數據"為傳遞的數據methods: {clickEventHandle() {this.$emit("someEvent", "來自Child的數據")}}
}
</script><template><h3>Child</h3><!-- 點擊按鈕觸發clickEventHandle方法，通過$emit傳遞數據給父組件 --><button @click="clickEventHandle">傳遞數據</button>
</template>

ComponentEvent.vue

<script>
import Child from "./Child.vue"export default {data() {return {// 用于存儲子組件傳遞的數據message: ""}},components: {Child},methods: {// 接收子組件傳遞的數據// data為接收到的數據getHandle(data) {this.message=data;}}
}
</script><template><h3>組件事件</h3><!-- 子組件監聽someEvent事件，綁定getHandle方法處理數據 --><Child @someEvent="getHandle"/><!-- 顯示接收到的數據 --><p>父元素：{{message}}</p>
</template>

溫馨提示
組件之間傳遞數據的方案：
父傳子：props
子傳父：自定義事件(this.$emit)