離子2 - 如何通過滑動手勢防止離子載玻片上的頁面變化？

Question

我看到了許多不同來源的解決方案，包括Stack Overflow。這部分對我有用：我無法左右滑動切換頁面。沒關係 ！但是，如果用戶點擊一個按鈕，按住並按下按鈕，這將導致分頁。 （我只是測試使用的是Android）

有許多來源，根據該解決方案是一個：

<ion-slides [options]="{onlyExternal: false}"> 
</ion-slides> 

讓我說明這一點與截圖...

如果我這裏刷，什麼都不會發生

現在，如果我拿着並刷紅色按鈕，這將導致分頁。

Answer 1

我做到這一點的方法是：

在我的.ts的頁面我有一個幻燈片文件，我這樣做

import { Component, ViewChild } from '@angular/core'; 
import { Slides } from 'ionic-angular'; 

@Component({ 
    selector: 'page', 
    templateUrl: 'page.html' 
}) 
export class Page{ 
    @ViewChild(Slides) slides: Slides; 

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

    nextSlide(){ 
    this.slides.lockSwipes(false); 
    this.slides.slideNext(); 
    this.slides.lockSwipes(true); 
    } 
} 

而在你的HTML調用該函數在一個按鈕上

<button ion-button block (tap)="nextSlide()">NEXT</button> 

所以當頁面構造時我鎖定滑動，當有人點擊下一步/返回時，我解鎖滑動，轉到下一張幻燈片並將其鎖定。

希望它有幫助