Question

我创建了运行正常的窗口侦听器。一段时间之后，我不知道窗口侦听器何时确切停止工作。调整大小事件也不起作用。我不知道它不起作用的原因可能是什么。

  mounted () {
    window.addEventListener('scroll', this.test)
  },
  destroyed () {
    window.removeEventListener('scroll', this.test)
  },
  methods: {
    test () {
      console.log('test')
    }
  }

编辑

我在主应用程序vue组件中创建了侦听器，但仍然无法正常工作。

<template>
  <div id="application" class="" style="height: 200vh">
<!--    <router-view/>-->
  </div>
</template>

<script>
export default {
  name: 'App',
  mounted() {
    window.addEventListener('scroll', this.test);
  },
  methods: {
    test () {
      console.log('test')
    }
  },
  watch: {
    $route: {
      immediate: true,
      handler(to) {
        document.title = this.$t(to.meta.title) || 'Some Default Title'
      }
    },
  }
}
</script>

EDIT2 装入组件后，函数从事件侦听器运行两次，不少于 screen

Answer 1

解决方案

HTML标记设置为100vh，因此窗口并没有真正移动。里面的孩子可以滚动。

窗口事件监听器未触发

1 个答案: