Async route breaks back-link navbar button

[JCKodel]

This is a (multiple allowed):

• [x] bug

• [ ] enhancement

• [ ] feature-discussion (RFC)

• Framework7 Version: 2.2.1

• Framework7-Vue Version: 2.2.1

• Platform and Target: Cordova Android

• Live Link or JSFiddle: https://jsfiddle.net/m8cx61sq/6/

Instructions for the JSFiddle

• Click the About link
• As this route has an async function (line 43), it will override the url/component to the Dynamic Route page.
• The Dynamic Route page has a back button that doesn't work (because of this bug).

What you did

I tried to implement an authentication hook using route async function. If the user is not authenticated, redirect him to an authentication page with a back button (<f7-navbar back-link="Cancel" />)

Expected Behavior

Redirect the user to the authorization page and allow him to cancel the authentiacation using the back link to get back where he was before.

Actual Behavior

The navbar back button or the $f7router.back() don't work (I guess the navigation stack is empty).

[JCKodel]

Perhaps related to https://github.com/framework7io/framework7/issues/2100?

[nolimits4web]

Sorry, but something really wrong is happening here:

• async and component can't be used together, only one prop of such kind is allowed. It doesn't make sense http://framework7.io/docs/routes.html#route-properties
• resolve(routeTo); doesn't make sense as it can produce infinite loop
• resolve({ url: "/dynamic-route/blog/1/post/1/", component: "page-dynamic-routing"}) - also doesn't make sense as only url or component can be used at same time

In F7-Vue, you need to use component and resolve routes with component as well

[JCKodel]

It would be nice some example in how to secure routes (authentication) on f7-vue documentation =\

[nolimits4web]

Solution is here http://forum.framework7.io/t/solved-f7-vue-async-router-blocks-back-function/3240