When framework7 jumps according to the routing page, how does the url change to the corresponding route?

problem description

for example, on the home page of http://xxx/index.html-sharp/, click a link to go to the application page, but the browser"s url has not changed; how to make the url also change to the corresponding route http://xxx/index.html-sharp/applic.? Like the route jump of vue, does url change?

related codes

routes = [{
        path: "/",
        url: "./index.html",
    },
    // Page Loaders & Router
    {
        path: "/table/",
        componentUrl: "./pages/table.html",
    },
    {
        path: "/application/",
        componentUrl: "./pages/application.html",
    },
];

<div class="row no-gap">
   <a href="/application/" class="col page-content-item"></a>
   <a href="/table/" class="col page-content-item"></a>
</div>

Please also tell the great god who knows, thank you.

Route url routing framework7

Jan.27,2022

finally solved. The latest version of f7 should set pushState:

like this.

var app = new Framework7({
    root: '-sharpapp', // App root element
    id: 'io.framework7.testapp', // App bundle ID
    name: 'Framework7', // App name
    view: {
        pushState: true,
    },
});

add pushState: true to main.js try

new vue({
    framework7: {
        // App Root Element, should be the same as the component root "el"
        root: '-sharpapp',
        // Array with app routes
        routes: router,
        pushState: true
    }
})

Previous: How does Tencent Map js sdk display the map on the page

Next: What is the $stateRegistryProvider service in angularjs's routing library angular-ui/ui-router?