Question

我正在尝试在vue应用程序上使用aos库。显然，它没有检测到滚动事件，因为它只显示屏幕上的元素，滚动后不显示其他元素。

所以我认为我可以添加一个窗口滚动事件侦听器来刷新AOS函数，但似乎并不会触发该函数。

我尝试了一些方法：

在组件的安装方法中添加侦听器：

  mounted () {
    window.addEventListener('scroll', function() {
      console.log('Scrolling')
    });
  }

在容器元素中添加侦听器。该命令有效，但根本不起作用，无法按预期方式持续触发，因此我不得不滚动多次才能触发一次：

<template>
  <div class="page" @scroll="scrollFunction">
    Content...
  </div>
</template>
<script>
  ...
  methods: {
    scrollFunction() {
      console.log('scrolling from method')
    }
  }
</script>

在创建和销毁的函数中添加窗口滚动侦听器（我在另一篇文章中看到了，但对我不起作用）：

  created () {
    window.addEventListener('scroll', this.scrollFunction);
  },
  destroyed () {
    window.removeEventListener('scroll', this.scrollFunction);
  }

在App.vue中创建的函数上添加窗口滚动侦听器。

Answer 1

第一个似乎对我有用（如下），您能否提供其余代码？

codesandbox

Vue未检测到滚动事件

1 个答案: