How to disable swipe back gesture, swipeBackEnabled doesn't work

Ionic Framework Ionic Vue
1

I’m trying to disable the swipe-back feature. I put swipeBackEnabled: false to config, but it only works on IOS. When I run the app on an Android device, the swipe gestures are still there.

main.js

const app = createApp(App)
  .use(IonicVue, {
    swipeBackEnabled: false
  })
  .use(router)
  .use(createPinia())

router.isReady().then(() => {
  app.mount('#app')
})

I also try to disable swipeGesture in App.vue, but still did not work.

App.vue:

<template>
  <ion-app>
    <ion-router-outlet swipeGesture="false"/>
  </ion-app>
</template>

Please help, thank you.

2

Problem solved. There are two nav modes in Android settings, button or swipe. On my test device, I’m using swipe mode, so I’m trying to find out how to disable swipe gesture. If I switch it to button mode, the swipe gesture will be disabled, and the back button will work. Then the problem turns to how to disable the hardware back button. Then I got the answer of adding “hardwareBackButton: false;” to IonicVue config. That’s it.

const getConfig = () => {
  return {
    hardwareBackButton: false,
    swipeBackEnabled: false,
    innerHTMLTemplatesEnabled: true,
  }
}

const app = createApp(App)
  .use(IonicVue, getConfig())
  .use(router)
  .use(createPinia())
1 Like
3

Is there any way to dynamically disable and enable the swipeBackEnabled variable?