Vue对全局事件的解绑

在我们编写代码的过程中，如果没有对事件进行及时的解绑，可能导致代码出现大量的bug。
如果绑定的仅仅是某个组件中的元素，那么不会对全局产生影响，但是如下面的代码，若对window这个全局对象进行了绑定，则会导致问题的出现。当我们离开这个页面去其他页面时，这个绑定事件仍然在起作用（尽管页面已经不再是handleScroll这个函数所在的组件，但window是全局对象）。

activated(){
        // 绑定scroll事件，一旦scroll，执行handleScroll事件
        window.addEventListener('scroll', this.handleScroll)
    },
}

那么我们就需要对这个事件进行解绑。解绑也非常的简单，只需要在同一组件的script部分加入一个deactivated生命周期函数即可。
deactivated生命周期函数在页面即将被隐藏或者即将被替换为其他页面时会起作用。这样当我们离开该组件的页面时，这个绑定事件就不再会对其他页面产生影响了。

    activated(){
        // 绑定scroll事件，一旦scroll，执行handleScroll事件
        window.addEventListener('scroll', this.handleScroll)
    },
    deactivated () {
        window.removeEventListener('scroll', this.handleScroll)
    }