Back button close app Framework7-vue v.3.6.6


I’m using framework7-vue 3.6.6 version to create my app.
When I click back button I exit the app. This is a behavior that I want to avoid, I want to navigate into old views. I tried all options:

  • Putting :push-state=“true” in main view (I get white screen!)
  • Putting in f7params: view: { pushState: true} (I get white screen too)

If I do not use the options mentioned before I can use and navigate app using framework7 navbar but if I click back button the app will be closed.
Help me, the app is almost done, I just need to solve this annoying problem!



This is the only solution I found until now and works well… Can I suggest to include this code for default? Or to implement something to better control this back button? Because this is the normal behavior of an android app…and a user that doesn’t know well cordova and framework7 can become crazy implementing this!!!

mounted() {
        var app = this.$f7;
        var $$ = this.$$;

        // Listen to Cordova's backbutton event
        document.addEventListener('backbutton', function navigateBack() {
                // Use Framework7's router to navigate back
                    var mainView = app.views.main;

                    var leftp = app.panel.left && app.panel.left.opened;
                    var rightp = app.panel.right && app.panel.right.opened;

                    if (leftp || rightp) {

                        return false;
                    } else if ($$('.modal-in').length > 0) {

                        return false;
                    } else if (app.views.main.router.url == '/') {
                    } else {

            , false)


I would suggest, instead of adding the event listener in mounted, add it in ‘deviceready’ event.

document.addEventListener("deviceready", onDeviceReady, false);