有限可变宽度的滑块（仅滚动可见的幻灯片），幻灯片应始终填充显示区域

Question

  

我希望这不是一个“大问题”，但我被困住了。我在github issues#1334上问了这个问题，但项目的维护者没有任何回应。希望我能在这里得到帮助。

概述

我的问题是我试图调整variable width滑块（来自react-slick文档）以达到：

1. finite

2. responsive（到不同的视口）（如果可能，根据视口的宽度显示尽可能多的幻灯片）

3. scroll only 100% visible slides

4. 幻灯片应填充div显示区域

观察

1. 到目前为止，我已经做到了：

   • finite

2. 关于responsive，断点不适用于variable width幻灯片。

3. scroll only 100% visible slides，这对于可变视口宽度和使用可变宽度幻灯片非常重要。

4. slides should fill the div display area，宽度可变的幻灯片到达最后一张幻灯片时，即使它已经被在上一个滚动时，用户仍然可以滚动，可见的是空白幻灯片的巨大区域，例如：

代码

可以在code sandbox

中复制并测试该问题

...
...

欢迎任何帮助。