机车滚动：检测到元素但数据滚动速度不起作用

如何解决机车滚动：检测到元素但数据滚动速度不起作用

我已经为本地测试项目安装了 LocomotiveScroll

首先：

npm install LocomotiveScroll

然后：

import LocomotiveScroll from 'locomotive-scroll';

const scroll = new LocomotiveScroll({
    el: document.querySelector('[data-scroll-container]'),smooth: true,repeat: true
});

添加了 HTML 和 CSS 进行测试，但检测到元素（“is-in-view”）并且 data-scroll-class 有效，但与 data-scroll-speed 无关

<div data-scroll-container>
      <section class="s1" data-scroll-section>
          <h1>hey</h1>
          <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Laudantium at sunt magnam cum quam natus,recusandae consequuntur voluptate reprehenderit,quis vitae. Eaque pariatur cumque provident,cum animi sapiente deleniti quae?</p>
      </section>
      <section class="s2" data-scroll-section>
          <h2>What's up?</h2>
          <p class="custom-p" data-scroll data-scroll-class="scroll-class">Lorem ipsum,dolor sit amet consectetur adipisicing elit. Dolores,at similique nobis nulla sit quos deserunt ipsa voluptates consequatur,molestiae hic perspiciatis illum temporibus qui autem dicta perferendis,distinctio provident.</p>
          <span data-scroll data-scroll-speed="4">Lorem ipsum dolor sit amet,consectetur adipisicing elit. Itaque,nulla ipsum veniam labore ipsam voluptatem nesciunt voluptatum cum. Sequi molestiae expedita adipisci natus excepturi nesciunt,vel provident neque a perferendis?</span>
      </section>
      <section class="s1" data-scroll-section>
        <h1>hey</h1>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Laudantium at sunt magnam cum quam natus,cum animi sapiente deleniti quae?</p>
    </section>
  </div>

CSS：

* { Box-sizing: border-Box; }

body { height: 100vh; background: red; color: #fff; }

section{ height: 100vh; padding: 8rem; }

.s1 { background: blue;}
.s2 { background: green;}

.custom-p{
   opacity: 0;
   transition: all 1s;
   position: relative;
   transform: translateY(60px);
}

.scroll-class{
   opacity: 1;
   transform: translateY(0);
}

有什么建议吗？谢谢，任何建议都很重要