Search code examples
vue.jsonsen-ui

How to fire deviceBackButton on `v-ons-alert-dialog`


In documentation, deviceBackButton is fired on device back button. It isn't fired on device back button in my application. Device back button terminates my application without showing alert dialog. I don't want to terminate app.

<template>
  <v-ons-alert-dialog
    @deviceBackButton="backButtonEvent"
  >
    ...
  </v-ons-alert-dialog>
</template>

<script>
export default {
  methods: {
    backButtonEvent(event) {
      alert('hello, world');
      return event.preventDefault();
    }
  }
}
</script>

Solution

  • This is due to a bug in Onsen UI.

    The bug has now been fixed but not released yet: https://github.com/OnsenUI/OnsenUI/commit/f55de7910

    It will be included in the next patch release of Onsen UI.

    So to answer your question, you can make sure the deviceBackButton handler is called by building Onsen UI from master and using that in your project, or you can use the next version when it is released.