初始化滑动滑块动态无法解释的行为

Question

我必须动态创建swiper的实例。这些滑动器已动态填充了图像内容。我整天都在缺乏技能的情况下进行战斗，因此无法正常工作。

没有任何JavaScript控制台错误，所以我假设有些根本上是错误的，但我不知道这是什么。

这里是代码：

<!-- The sliders are initiated very standard way, i skipped showing them. These are my paginations where I cannot get the pagination to be rendered -->

<div class="secondary-0 swiper-pagination-clickable swiper-pagination-bullets"></div>
<div class="secondary-1 swiper-pagination-clickable swiper-pagination-bullets"></div>
<div class="secondary-2 swiper-pagination-clickable swiper-pagination-bullets"></div>

<script>
    // I get lots of image data from php here
    var imagearrays = <?php echo json_encode( $images_multiarray_js ); ?>;

    // initialize variables for use in the loop. 
    var i;
    var subNameArray = [];
    var subSwiper = [];

    // Loop through the imagearrays variable and initiate swipers.
    for (i = 0; i < imagearrays.length; i++) {
        subNameArray[i] = imagearrays[i].imagenames;
        subSwiper = new Swiper('.subswiper-' + i, { // all my swiper-containers have extra class "subswiper-0" "subswiper-1" etc.
            pagination: { // my main issue: I cannot get this pagination to render. WHY?
                el: '.secondary-' + i, //my paginations have class like "secondary-0"
                clickable: true,
                renderBullet: function (index, className) {
                    return '<span class="' + className + '"><div class="pagination-ball"></div>' + subNameArray[index] + '</span>';
                }
            },
            loop:true,
            effect: 'fade',
            clickable:true,
            disableOnInteraction:false,
        });
    }
</script>

这是我的imagearrays变量的样子，只是为了向您展示它很好。

[
  {"controllertype":false,"imagenames":["name1","name2"]},
  {"controllertype":true,"imagenames":["name3","name4"]},
  {"controllertype":false,"imagenames":["name5","name6"]}
]

我尝试在调试JS模式下逐行进行，但看起来控制台只是跳过了“ new Swiper（...”）行以及其中的所有内容。同样，控制台中没有错误。

Answer 1

如何感到真正的愚蠢：

1. 花半天的时间弄清楚代码为什么不起作用
2. 一时兴起，请检查您的滑动选择器类是否已附加到正确的html元素上，并意识到它没有]]
3. 在stackoverflow中哭泣

[对不起，这个问题没有用。一切都按预期解决了。