How to redirect it to a page, router.load, Framework7?

Good morning.

I do the following flow between pages, worked in a hybrid application.

Start on page1 - > page2 - > page3

to find me on page3 I have the following button:

 <button id="principal" class="principal">Continuar</button>

in which I perform the following function:

$$(".principal").on('click', function (e) {
        console.log("regresar a principal");
           mainView.router.load({
           url: 'vistas/pagina1.html',
           force: true,
           ignoreCache: true
         });
    });
});

and effectively send me to page1. But the problem arises when I continue the flow of pages again and I go to page2, then when I press the return button (NOT THE BROWSER) it sends me to page3, when in fact it should send me to page1. Visually, the return button is as follows:

<div class="left">
                <a class=" icon-only back">
                    <i class="icon icon-back"></i>
                </a>
            </div>