Browse Source

Bug Fix: Need to update the arrow status after components are mounted.

Naotoshi Fujita 2 năm trước cách đây
mục cha
commit
282e6f2f0f

+ 1 - 1
dist/js/splide.cjs.js

@@ -1855,7 +1855,7 @@ function Arrows(Splide2, Components2, options) {
   }
 
   function listen() {
-    on([EVENT_MOVED, EVENT_REFRESH, EVENT_SCROLLED, EVENT_END_INDEX_CHANGED], update);
+    on([EVENT_MOUNTED, EVENT_MOVED, EVENT_REFRESH, EVENT_SCROLLED, EVENT_END_INDEX_CHANGED], update);
     bind(next, "click", apply(go, ">"));
     bind(prev, "click", apply(go, "<"));
   }

+ 1 - 1
dist/js/splide.esm.js

@@ -1850,7 +1850,7 @@ function Arrows(Splide2, Components2, options) {
   }
 
   function listen() {
-    on([EVENT_MOVED, EVENT_REFRESH, EVENT_SCROLLED, EVENT_END_INDEX_CHANGED], update);
+    on([EVENT_MOUNTED, EVENT_MOVED, EVENT_REFRESH, EVENT_SCROLLED, EVENT_END_INDEX_CHANGED], update);
     bind(next, "click", apply(go, ">"));
     bind(prev, "click", apply(go, "<"));
   }

+ 1 - 1
dist/js/splide.js

@@ -1848,7 +1848,7 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
     }
 
     function listen() {
-      on([EVENT_MOVED, EVENT_REFRESH, EVENT_SCROLLED, EVENT_END_INDEX_CHANGED], update);
+      on([EVENT_MOUNTED, EVENT_MOVED, EVENT_REFRESH, EVENT_SCROLLED, EVENT_END_INDEX_CHANGED], update);
       bind(next, "click", apply(go, ">"));
       bind(prev, "click", apply(go, "<"));
     }

Những thai đổi đã bị hủy bỏ vì nó quá lớn
+ 0 - 0
dist/js/splide.min.js


BIN
dist/js/splide.min.js.gz


Những thai đổi đã bị hủy bỏ vì nó quá lớn
+ 0 - 0
dist/js/splide.min.js.map


+ 4 - 2
src/js/components/Arrows/Arrows.ts

@@ -2,7 +2,9 @@ import { ALL_ATTRIBUTES, ARIA_CONTROLS, ARIA_LABEL } from '../../constants/attri
 import { CLASS_ARROWS } from '../../constants/classes';
 import {
   EVENT_ARROWS_MOUNTED,
-  EVENT_ARROWS_UPDATED, EVENT_END_INDEX_CHANGED,
+  EVENT_ARROWS_UPDATED,
+  EVENT_END_INDEX_CHANGED,
+  EVENT_MOUNTED,
   EVENT_MOVED,
   EVENT_REFRESH,
   EVENT_SCROLLED,
@@ -147,7 +149,7 @@ export function Arrows( Splide: Splide, Components: Components, options: Options
    * Listens to some events.
    */
   function listen(): void {
-    on( [ EVENT_MOVED, EVENT_REFRESH, EVENT_SCROLLED, EVENT_END_INDEX_CHANGED ], update );
+    on( [ EVENT_MOUNTED, EVENT_MOVED, EVENT_REFRESH, EVENT_SCROLLED, EVENT_END_INDEX_CHANGED ], update );
     bind( next, 'click', apply( go, '>' ) );
     bind( prev, 'click', apply( go, '<' ) );
   }

+ 45 - 8
src/js/test/php/examples/fade.php

@@ -21,10 +21,10 @@ $settings = get_settings();
       var splide = new Splide( '#splide01', {
         width: 800,
         type : 'fade',
-	      rewind: false,
-	      rewindByDrag: false,
-	      autoplay: true,
-	      interval: 1000,
+	      // rewind: false,
+	      // rewindByDrag: false,
+	      // autoplay: true,
+	      // interval: 1000,
         breakpoints: {
           640: {
             width: '100%',
@@ -34,15 +34,52 @@ $settings = get_settings();
 
       splide.mount();
 
-      setTimeout( () => {
-        splide.refresh();
-      }, 1000 );
+      // setTimeout( () => {
+      //   splide.refresh();
+      // }, 1000 );
     } );
   </script>
+
+  <style>
+    /*.splide__list {*/
+    /*  align-items: flex-start;*/
+    /*}*/
+
+    .splide__slide {
+      background: #fff;
+    }
+  </style>
 </head>
 <body>
 
-<?php render(); ?>
+<section id="splide01" class="splide" aria-label="Basic Structure Example">
+  <div class="splide__track">
+    <ul class="splide__list">
+      <li class="splide__slide">
+        <img src="../../assets/images/pics/slide01.jpg">
+        <p>
+          Lorem ipsum dolor sit amet, quod sale at pro, everti iisque tractatos sit ea. Agam alterum sit at. Libris petentium his ne, ne eam detraxit inimicus tractatos. Ius mundi verear ad, at percipit constituto pro, ei possim eirmod quo. Vim laudem aperiam reprehendunt in.
+        </p>
+      </li>
+      <li class="splide__slide">
+        <img src="../../assets/images/pics/slide02.jpg">
+        <p>
+          Has cu etiam veniam recusabo, his animal nostrud fabellas ne. Vis suas qualisque eu, eum ei impedit civibus, an solum definiebas pro.
+        </p>
+      </li>
+      <li class="splide__slide">
+        <img src="../../assets/images/pics/slide03.jpg">
+        <p>
+          Mollis epicuri laboramus ea qui, his ei meis graecis quaestio. Ius ne suscipit prodesset. Qui at delicata euripidis eloquentiam, eius solum volumus eum eu. Usu eu deserunt abhorreant, errem qualisque nec in. Te has labitur virtute hendrerit, cum quaeque oportere mediocritatem in, eos imperdiet intellegam id.
+        </p>
+        <p>
+          Has cu etiam veniam recusabo, his animal nostrud fabellas ne. Vis suas qualisque eu, eum ei impedit civibus, an solum definiebas pro.
+        </p>
+      </li>
+    </ul>
+  </div>
+</section>
+
 
 </body>
 </html>

Một số tệp đã không được hiển thị bởi vì quá nhiều tập tin thay đổi trong này khác