Vue JS如何移除殭屍事件？

Question

如何刪除殭屍事件？

當向前切換時，返回$ on事件會執行很多次。

App.vue

<template> 
    <input type="button" @click.prevent="click()" value="click"> 
<template> 

<script> 
    export default { 
    methods: { 
     click: function(){ 
     this.$emit('go') 
     } 
    } 
    } 
<script> 

Children.vue

<script> 
    export default { 
    methods: { 
     go: function() { 
     console.log('event received') 
     } 
    }, 
    created: function(){ 
     this.$parent.$on('go', this.go); 
    } 
    } 
<script> 

Answer 1

您需要刪除的事件，當你刪除的組件：

<script> 
    export default { 
    methods: { 
     go: function() { 
     console.log('event received') 
     } 
    }, 
    created: function(){ 
     this.$parent.$on('go', this.go); 
    }, 
    beforeDestroy: function(){ 
     this.$parent.$off('go',this.go); 
    } 
    } 
<script> 

Answer 2

你click方法created生命週期掛鉤，所以它會被稱爲每當children組件將被渲染。