Refresh current page and the previous one

Questions
1

I’m using version 1.6.
I’m at page about.html, and in this page I click to change the language of my app, then I call refreshPage() and its work, but I’d like to update the previous page as well. In fact, I’d like all the pages in the DOM to be updated so it can load with new language.

I tried this code but it’s now working, only the first refresh works:

window.tommy.f7view.router.refreshPage({
  url: 'views/about.html'
});
window.tommy.f7view.router.refreshPreviousPage();
2

It is a bit tricky, because once one page is in loading process, router is kind of locked and won’t let you to load/refresh another page. This kind of hack can help:

window.tommy.f7view.router.refreshPage({
  url: 'views/about.html'
});
window.tommy.f7view.allowPageChange = true;
window.tommy.f7view.router.refreshPreviousPage();
3

As for refresh/reload all pages, no way to do it, only manually loading and replacing the data.
That is why F7+Vue would be super handy here because it can do it dynamically and automatically

4

I tried your code, it reload the previous page but now the current page doesn’t get changed. This is what was happening with me, seems that we can’t call this two methods one after the other.

5

Try something more advanced then:

Add the following flag to your app object

window.tommy.routerLoading = false;

Then add onAjaxStart, onAjaxComplete app parameters like:

new Framework7({
  onAjaxStart() {
    window.tommy.routerLoading = true;
  }
  onAjaxComplete() {
    window.tommy.routerLoading = false;
    $$(document).trigger('roterLoaded);
  }
});

Then modify it using events:

window.tommy.f7view.router.refreshPage({
  url: 'views/about.html'
});
function refreshPrevious() {
  setTimeout(() => {
    window.tommy.f7view.router.refreshPreviousPage();
  }, 300);
}
if (window.tommy.routerLoading) {
  $$(document).once('roterLoaded', () => {
    refreshPrevious();
  })
} else {
  refreshPrevious();
}
6

It worked @nolimits4web. Both current page and previousPage changed. But in this app I have a side panel an it was not change, but I believe I can do it. Thanks

1 Like