feat(navigation): add navigationPrev and navigationNext events

fixes #5832
nolimits4web · Jun 29, 2022 · d0c6365 · d0c6365
1 parent 78a8d90
commit d0c6365
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 0 deletions.
diff --git a/src/angular/src/swiper.component.ts b/src/angular/src/swiper.component.ts
@@ -325,6 +325,10 @@ export class SwiperComponent implements OnInit {
 
   @Output('navigationShow') s_navigationShow = new EventEmitter<EventsParams['navigationShow']>();
 
+  @Output('navigationPrev') s_navigationPrev = new EventEmitter<EventsParams['navigationPrev']>();
+
+  @Output('navigationNext') s_navigationNext = new EventEmitter<EventsParams['navigationNext']>();
+
   @Output('observerUpdate') s_observerUpdate = new EventEmitter<EventsParams['observerUpdate']>();
 
   @Output('orientationchange') s_orientationchange = new EventEmitter<

diff --git a/src/modules/navigation/navigation.js b/src/modules/navigation/navigation.js
@@ -60,11 +60,13 @@ export default function Navigation({ swiper, extendParams, on, emit }) {
     e.preventDefault();
     if (swiper.isBeginning && !swiper.params.loop && !swiper.params.rewind) return;
     swiper.slidePrev();
+    emit('navigationPrev');
   }
   function onNextClick(e) {
     e.preventDefault();
     if (swiper.isEnd && !swiper.params.loop && !swiper.params.rewind) return;
     swiper.slideNext();
+    emit('navigationNext');
   }
   function init() {
     const params = swiper.params.navigation;

diff --git a/src/types/modules/navigation.d.ts b/src/types/modules/navigation.d.ts
@@ -37,6 +37,14 @@ export interface NavigationEvents {
    * Event will be fired on navigation show
    */
   navigationShow: (swiper: Swiper) => void;
+  /**
+   * Event will be fired on navigation prev button click
+   */
+  navigationPrev: (swiper: Swiper) => void;
+  /**
+   * Event will be fired on navigation next button click
+   */
+  navigationNext: (swiper: Swiper) => void;
 }
 
 export interface NavigationOptions {

diff --git a/src/vue/swiper.js b/src/vue/swiper.js
@@ -181,6 +181,8 @@ const Swiper = {
     'momentumBounce',
     'navigationHide',
     'navigationShow',
+    'navigationPrev',
+    'navigationNext',
     'observerUpdate',
     'orientationchange',
     'paginationHide',