离子滑块-lockSwipes(true)禁用initialSlide和slideNext()方法? [英] ionic slider - lockSwipes(true) disables initialSlide and slideNext() methods?

问题描述

我正在使用Ionic的幻灯片来显示待办事项列表和由于列表项包含滑动手势，因此我想禁用滑动手势.相反，我想通过方法更改幻灯片.

Hi I'm using Ionic Slides to display todo lists and I want to disable the swipe guestures since my list items have them. Instead I want to change the slides via methods.

这是我的组件:

@ViewChild(Slides) slides: Slides;

days: SbCalendarDay[] = [] //this is a list of todo's of each day

ngAfterViewInit() {
    this.slides.lockSwipes(true);
}

slide(direction:string){
    if(direction === 'prev'){
        this.slides.slidePrev()
    }else{
        this.slides.slideNext()
    }
}

我的观点:

<div class="sb-calendar-day">
    <ion-slides [initialSlide]="1" (ionSlideDidChange)="slideChanged($event)" (ionSlideWillChange)="slideWillChange($event)">
        <ion-slide *ngFor="let day of days">
            <sb-list [list]="day.events" (sbListEvent)="listEvent($event)"></sb-list>
        </ion-slide>
    </ion-slides>
</div>

但是，当我锁定滑动时，initialSlide输入不再起作用.我从3天的array开始，而array[1]是当天.

However when I lock the swipes, the initialSlide input doesn't work anymore. I'm starting off with an array of 3 days with array[1] being the current day.

此外，方法slideNext()和slidePrev()也没有反应. lockSwipes(true)是否完全锁定"滑块?

Furthermore the methods slideNext() and slidePrev() also don't react. Does lockSwipes(true) completely "lock down" the slider?

有没有一种方法只能禁用滑块的滑动手势?

Is there a way to only disable the swiping gestures of the slider?

谢谢

推荐答案

是的，通过查看

Yes, by looking at the source code for lockSwipes(), it seems like the functions slideNext and slidePrev gets 'locked':

lockSwipes(shouldLockSwipes: boolean) {
    this._allowSwipeToNext = this._allowSwipeToPrev = !shouldLockSwipes;
}

该函数最终最终调用从slideTo-function .ts"rel =" noreferrer> swiper.ts ，在其中检查_allowSwipeToNext和_allowSwipeToPrev:

The function ultimately ends up calling slideTo-function thats being imported from swiper.ts, where a check against _allowSwipeToNext and _allowSwipeToPrev is made:

// Directions locks
if (!s._allowSwipeToNext && translate < s._translate && translate < minTranslate(s)) {
    return false;
}
if (!s._allowSwipeToPrev && translate > s._translate && translate > maxTranslate(s)) {
    if ((s._activeIndex || 0) !== slideIndex ) return false;
}

initialSlide-输入不起作用是因为在从

initialSlide-input does not work is because in the function initSwiper imported from swiper.ts, the value of initialSlide is used as an argument to the function slideTo, and the _allowSwipe[Next|Prev] flags are checked.

仅禁用滑动手势，请使用 onlyExternal :

For disabling only swipe gestures use onlyExternal:

onlyExternal:如果为true，则切换幻灯片的唯一方法是使用外部API 诸如slidePrev或slideNext之类的功能

onlyExternal: If true, then the only way to switch the slide is use of external API functions like slidePrev or slideNext

ngAfterViewInit() {
    this.slides.onlyExternal = true;
}

这篇关于离子滑块-lockSwipes(true)禁用initialSlide和slideNext()方法?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！