How can i use setDefaultDeviceBackButtonListener with Vue



  • Hi everyone,

    How can i use setDefaultDeviceBackButtonListener with Vue. I cant use it.

    https://onsen.io/v2/api/vue/$ons.html page is not satisfying. There is not a working example.

    Can anyone help me?
    Thanks for your patience.


  • Onsen UI

    @fatihucom Hi!

    this.$ons.setDefaultDeviceBackButtonListener(function() {
       console.log('hello');
    });
    

    You can call it at the beginning of the app, like explained in the docs.



  • @Fran-Diox Hi,

    I try it on beforeCreate function

    beforeCreate: function () {
        try {
            this.$ons.setDefaultDeviceBackButtonListener(function () {
                alert('hello');
            });
        } catch (e) {
            console.log(e);
        }
    }
    

    Its not working. But when i try this its working.

    beforeCreate: function () {
        try {
            if (this.$ons.isReady()) {
                //this.$ons.disableDeviceBackButtonHandler();
                window.document.addEventListener('backbutton', function () {
                    alert('back');
                }, false);
            }
        } catch (e) {
            console.log(e);
        }
    }
    

    Whats my wrong?
    Thanks again.


  • Onsen UI

    @fatihucom

    As said in the description, it must be called on $ons.ready. Also, this only applies to the “default” handler, not to every component handler. See this codepen for more details (press ESC to simulate a device back button). It only works when Navigator’s handler doesn’t (when the stack is <=1).



  • @Fran-Diox Thanks for all, thanks for the example.


Log in to reply