在Vue中使用AOS库

Question

我在vue中使用AOS（滚动动画）库。 AOS提供了自定义的JS事件： document.addEventListener('aos:in', ({ detail }) => { console.log('animated in', detail); });

我想在此事件发生时触发一个函数。 如何将其应用于vue组件？ 看起来像： v-on-aos:in使用v-on / @ ，但是不起作用。

这就是我尝试过的方法： <div v-on:aos:in="myFunction" />

Answer 1

在创建的方法上添加文档事件侦听器，然后传递vue组件方法。

  created() {
    document.addEventListener('aos:in', this.aosEvent)
  },
   methods: {
    aosEvent(d){
      // event data
      console.log(d);
    }
  }