[SOLVED]Refresh previous and back


#1

I use framework7 1.6.5 and framework7-vue 0.9.4, as the framework7-vue template in the framework7 homepage. I have a path like a/b/c, I make data changes in page ‘c’ and want to go back to page ‘b’ and refresh page ‘b’. I have tried some ways but didn’t work yet.

In component ‘b’ & ‘c’, I get data this way.

Vue.component('page-groups', {
    template: '#page-groups',
    data: function () {
        var store = this.$root.selectedGroup;
        return {
            contactsList: store.lists,
            groupName: store.myGName
        }
    }
}

In these ways below, either .back() or .refreshPreviousPage() --who comes first-- work, but they don’t work together.

this.$router.back();
this.$router.refreshPreviousPage();

or

this.$router.refreshPreviousPage();
this.$router.back();

In these ways below, only go back, no refresh.

this.$router.back({ignoreCache: true});

or

this.$router.back({reloadPrevious: true});

or

this.$router.back({reload: true});

or

this.$router.back({reloadPrevious: true, ignoreCache: true });

#2

Try $router.back(‘your route url’, {‘force’ : true});


#3

framework7-vue v1
After many many attempts, the method below partially solved my issue.

var historyLength = comp.$route.view.history.length;
var previousPage = comp.$route.view.history[historyLength - 2];
this.$f7.mainView.back({url: previousPage, force: true, reloadPrevious: true});


history{
  0:"#null"
  1:"/groups/"
  2:"/groupContacts/"
}

But it has a bug, like the history shown above, in “/groupContacts/” we go back, methods above changes history, and reload previous page, but the unrefreshed page “/groups/” is still in DOM, actually we have two “/groups/” pages in DOM at the same time.

Then I use DOM7 to remove the redundant page from DOM.

this.$$('.page-on-left').eq(this.$$('.page-on-left').length - 1).remove();