shopify幻灯片部分中的一个奇怪问题

Question

希望你们一切顺利。

所以我使用 Swiper js 创建幻灯片部分，真正的问题是在主题编辑器中，当我添加部分并单击幻灯片 2 时，例如我的脚本不起作用，但是当我保存更改时它工作正常.

我错过了什么吗？

这是我为点击每张幻灯片时更改幻灯片而写的内容

 {% if request.design_mode %}
        $(document)
        .on('shopify:section:load', MakeTheSlider )
        .on('shopify:section:unload', process_slick_event )
        .on('shopify:section:select', process_slick_event )
        .on('shopify:section:deselect', process_slick_event )
        .on('shopify:section:reorder', process_slick_event )
        .on('shopify:block:select', process_slick_event )
        .on('shopify:block:deselect', process_slick_event );
      {% endif %}
 
  function process_slick_event(evt){
        if(evt.detail.sectionId === '{{section.id}}'){
          var CurrentSlide = $("#slideshow-{{ section.id }}").find('#'+evt.target.id).data('index');
 
          $("#slideshow-{{ section.id }} #pagginat-{{ section.id }} :eq("+CurrentSlide+")").click();
        }
      }

我还有一个问题。 为什么当用户添加一个部分并且需要保存或刷新才能正常工作时，js 代码不起作用？ 我们对此有什么解决方案吗？ 提前致谢。

Answer 1

没什么好担心的。如果添加外部 JS 文件。加载需要一些时间。如果一个编辑器是打开的，它看起来像是坏了。保存后就没事了。我在使用 slick 和 owl-carousels 时也发生了这种情况。