Router.js navigate

Hello,

I want to navigate within a router route on page init. The problem is that the navigation is not working.
I use a sample installation from framework7.

insight my index.html:

<script_>
  export default function (props, { $, $f7, $on, $onBeforeMount, $onMounted, $onBeforeUnmount, $onUnmounted }) {


        $on('pageInit', () => {

          //working
          setTimeout(function(){

            console.log('test');
            $f7.views.main.router.navigate('/screen1/');
            }, 3000);

          //not working
          $f7.views.main.router.navigate('/screen1/');

        });
        // Return render function
        return $render;
      }
    </script_>

Also not working inside the router.js

{
    path: '/',
    componentUrl: './pages/splash.html',
    on: {
      pageInit: function (event, page) {

        var router = this;

        router.navigate('/screen1/');
        
        /* remove sidebar */ 
      },
    }

  },