[v6] Pushing routes on runtime

Hi, I’m using F7 Vue, and I can’t find my way around to adding/pushing routes programatically/dynamically.

The app is already mounted and I actually fetch a list of valid routes from a server, then I do something like this:

f7.views.main.routes.push({ path: '/objects/', component: ObjectsListPage, });

But then when I try to navigate to that route:

f7.views.main.router.navigate('/objects/');

I get the default “Not found” page.

What’s wrong with this? (same route with same component but hardcoded into app init works good)

Thanks in advance :slight_smile:

use Array’s unshift method instead of push:

f7.views.main.routes.unshift({ path: '/objects/', component: ObjectsListPage, });

404 route (.*) must be the last one in routes array

1 Like

you know…I’m kinda starting to understand the way you think and I was literally seconds away from trying that :slight_smile:

thanks, it worked perfectly!

although…
All this (and also related to this Dynamic components with dynamic unknown binds - #9 by Namida - Vue Forum) took me on a different direction…

I’m thinking of having 2 apps inside of one, instead of just one. The app “itself” and a controller of some sorts (doesn’t really matter if it’s literally [whatever], vanilla javascript, a Vue app, etc.

Right now I’m using a popup as a splash-screen of some sorts to show some info of what the app is doing, and a login component to manage users auth. Then I fetch everything from server and start to dynamically create the rest.

The app in the end, is just some kind of proxy to whatever the server tells it to do.

But defining anything, for instance components, on runtime with the app already up and running seems to be…“troublesome” to say the least.

So I’m thinking of using this “controller app” first and moving this splash and login screen there, then I can fetch everything from server, dynamically define whatever regardless of how complex it is, and then create the actual “real” app on demand based on that, later on, I can use the same controller to destroy and/or recreate that app when needed…

That’s my idea for now…I should probably look into SSR…