登录页用的scale方法适应，如何正确销毁

我现在做的是一个PC端的项目，我想的是登录页用scale方法做自适应，然后其他页面就用elementUI自带的row和col，以下是我一开始的错误写法，这个代码我的想法是可以正常实现的，但是我发现在其他页面的时候，会因为获取不到main报错，按理来说我在beforeDestroy时期已经销毁了监听其他页面是不会再继续执行的，一开始我是没有想明白的

 

 后来我请教了一个师兄，直接在setScale中做一个判断，这样控制台的确不会继续报错，但是我发现其实debounce这个方法还是在被执行的，比较浪费性能

  最终发现用window.addEventListener('resize', this.debounce(this.setScale, 10))来监听窗口改变，在调用this.debounce函数时，并没有传递包含this.setScale方法的回调函数作为参数，而是直接将this.setScale作为参数传递给了debounce函数。这意味着每次组件更新时，都会创建一个新的debounce函数，因此即使在组件销毁后调用window.removeEventListener移除监听器，但之前创建的debounce函数仍然存在。需要将将debounce函数和setScale方法绑定到组件实例上，在销毁期间移除监听器时同时也移除setScale方法。

以下是修改后的代码：

 mounted() {
    this.setScale()
    this._setScale = this.debounce(this.setScale, 10);
    window.addEventListener('resize', this._setScale);
  },
beforeDestroy() {
    window.removeEventListener('resize', this._setScale);
  }