Question

我想制作三个旋转木马：

$(document).ready(function() {
        $('#c1').slick({
            dots: true,
            slidesToShow: 1,
            slidesToScroll: 1,
            autoplay: true,
            autoplaySpeed: 7 * 1000,
            mobileFirst: true,
            arrows: true
        }); 
         $('#c2').slick({
            dots: false,
            slidesToShow: 1,
            slidesToScroll: 1,
            autoplay: true,
            autoplaySpeed: 7 * 1000,
            mobileFirst: true,
            arrows: false
        });
         $('#c3').slick({
            dots: false,
            slidesToShow: 1,
            slidesToScroll: 1,
            autoplay: true,
            autoplaySpeed: 7 * 1000,
            mobileFirst: true,
            arrows: false
        });
     });

但是当我执行此代码时，会出现此错误消息：

slick.min.js:17 Uncaught TypeError: Cannot read property 'add' of null

我也在这里试过这个

.not('.slick-initialized').slick()

然后它不会抛出任何错误，但只会创建第一个轮播。

你们有什么想法吗？提前谢谢。

Answer 1

好像slickslider似乎无法找到它需要的对象。确保您的代码中存在您的ID（c1，c2，c3）。

来自官方的slickslider-page（http://kenwheeler.github.io/slick/）：

utf-8

确保不要在同一个元素上调用两次slick（）函数。

Answer 2

如果我们要使用的每个轮播的设置都相同，我将建议使用单个类或id的另一种解决方案：

providedIn

Slick.js创建了多个轮播

2 个答案: