Javascript 滑动滑环滑到最后一个滑环，同时捕捉到左侧

在Swiper演示中，幻灯片会一直捕捉到屏幕的左侧，直到到达最后一张幻灯片为止，因为（我猜）Swiper不想在右侧显示空白，所以无法捕捉到左侧：

幻灯片10永远不会捕捉到左侧

在我看来，这对用户来说就像一个bug，尤其是当你触发幻灯片到幻灯片10时，它只会弹出到右侧

我发现的解决办法是要么添加空白幻灯片，要么在最后一张幻灯片的右侧添加边距，这样幻灯片就会捕捉到左侧：

.swiper-slide:last-child {
  margin-right: calc(100vw - 300px);
}

将页边距添加到最后一张幻灯片的右侧

在末尾添加空白幻灯片

使用循环功能，然后隐藏重复项

有更好的或内置的方法吗？这不需要使用变通方法吗

---

我希望以后动态更改此间距，如果手动更改，则必须调用swiper.update（）以进行布局更新。另外，我当前的解决方法要求您知道幻灯片的宽度，或者使用自定义javascript计算宽度。因此，内置或响应式解决方案更可取

您当前的解决方案可能是非常理想的，我不认为有任何内在的方法可以实现您想要做的事情。但是，您可以考虑使用<代码>循环：Trime< /Cord>选项，这样可以提供更好的用户体验。

---

尝试添加循环幻灯片：8，并删除右边的边距：calc（100vw-300px）

---

您应该添加循环true。。所以它一直在下滑。。右边的旁瓣没有更多的空间是不理想的，因为我想要空白。我尝试过添加循环并隐藏重复的幻灯片，但这允许您继续循环，除非我用自定义函数替换next/prev。这似乎不起作用？loopedSlides不需要与loop一起使用吗？启用loop后，您可以继续点击箭头，最终返回幻灯片1，因此这并不理想。但如此接近！看起来你可以禁用箭头，然后它就可以工作了！如果添加循环意味着。。不需要循环幻灯片8。。只需尝试添加循环即可@Kim TI确实尝试了循环，但就我而言，我不想看到重复的幻灯片。我想我可以用css隐藏它们。

var container = document.getElementById('container');
var content = document.getElementById('content');
var swiper = new Swiper('.swiper-container', {
  navigation: {
    nextEl: '.swiper-button-next',
    prevEl: '.swiper-button-prev',
  },
  slidesPerView: 'auto',
  autoplayDisableOnInteraction: false,
  loopedSlides: 8,
});