clearPreviousHistory() method does not remove all pages in the history

Hi, I am using template7 pages when my app init. The application has a registration that takes three pages - the first is template7 page, and other two - Router Component. When the user goes through the last registration page I call the methods

mainView.router.clearPreviousHistory();
location.reload();

This allows the user to get to the start page(template7) of the application, but if you press the Back button, the application will transfer to the previous page. And not on the last of the three pages of registration, and the average. That is, the application behaves as follows:

RegistrationPage1 > RegistrationPage2 > RegistrationPage3 > StartPage > press back button > RegistrationPage2

This is the page layout:

<template>
<div class="page" data-name="confirmPhone" style="background-color:white; overflow: hidden">

<div class = "page-content">
...
</div>

</div>
</template>

And so page looks in routes.js file:

{
	path: '/confirmPhone/',
	async: function (routeTo, routeFrom, resolve, reject) {
			
             resolve(
                {
                    componentUrl: './pages/confirmPhone.html',
                },
				{
                    context: {
                    }
                }
              );

           },
	on: {
		pageInit: function (page) {
			var cleave = new Cleave('.input-phone', {
				blocks: [10],
				numericOnly: true
			});
		},
	},
		
},

And so is the transition to the RegistrationPage2:

$$(document).on('click','#continueBtn',function(){
	mainView.router.navigate('/confirmPhone/');
});

What am I doing wrong?