0

我正在尝试使用带有 Locomotive Scroll 的 Nuxt 创建一个项目，但不知何故，平滑滚动在我执行“检查元素”-> 然后关闭它之前不起作用。我试图监听滚动事件，我得到了滚动对象。

这是我的文件夹结构

// default.vue
<template>
  <div>
    <div id="appContainer" ref="appContainer" data-scroll-container class="w-screen">
      <Nuxt/>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      lms: null,
    };
  },
  mounted() {
    this.$nextTick(() => {
      this.initScroll();
    });
  },
  methods: {
    initScroll() {
      const _vm = this;
      this.lms = new this.locomotiveScroll({
        el: _vm.$refs.appContainer,
        smooth: true,
        tablet: {
          smooth: true,
        },
        smartphone: {
          smooth: true,
        },
        getDirection: true,
      });
    },
  },
};
</script>

// @/plugins/locomotiveScroll.js

import Vue from 'vue';
import LocomotiveScroll from 'locomotive-scroll';

Object.defineProperty(Vue.prototype, 'locomotiveScroll', {
  value: LocomotiveScroll,
});

// nuxt.config.js
plugins: [
  {
    src: '@/plugins/locomotiveScroll',
    mode: 'client',
  }
],

我在这里错过了什么吗？已经挣扎了好几个小时似乎找不到是什么原因造成的。：/

4

0 回答 0