Add initial page to history in vue-router...

[kris-erickson]

I’m trying to add a page to the vue-router so that there is at least one back on the history when showing the initial page. i.e. I want the user to be pushed to the “order” page, but allow them if they want to go back one page with the back button (this is going to be a cordova Aoo so the back button on the device should work rather than having an html back button) This is conditional (there are conditions on loading that bring you to, shall we call it page 2), and so in the boot hook, I am attempting to push the page on the history (however when the page loads there is no back button enabled):

export default boot(async ({router, store }) => {
// Code to determine whether to go to the order page
router.push({name: 'order'}, () => {
    console.log('Routed to order');
    resolve();
});

So I tried double pushing:

router.push({name: 'default'}, () => {
    router.push({name: 'order'}, () => {
        console.log('Routed to order');
        resolve();
    });
});

but that didn’t help… I even tried more hackery:

router.push({name: 'default'}, () => {
    setTimeout(() => {
         router.push({name: 'order'}, () => {
            console.log('Routed to order');
            resolve();
        });
    }, 1000);
});

But nothing ends up on the backstack. I am using the ‘hash’ router mode, as this will be a cordova app. Any suggestion as how to add an extra page onto the history on load of the application?

[dobbel]

@kris-erickson said in Add initial page to history in vue-router...:

this is going to be a cordova Aoo so the back button on the device should work rather than having an html back button

This is only valid for Android app’s made with Cordova not IOS apps( made with Cordova).

Does this pushing routes and going back work as desired in SPA mode?( with the browser back button)?

[kris-erickson]

@dobbel No, not it doesn’t work in SPA mode or on the device…

[dobbel]

@kris-erickson

If you put the code in the mounted hook of my layout it works( for me):

mounted () {
   this.$router.push({ name: 'default' }, () => {
            this.$router.push({ name: 'order' }, () => {
                console.log('Routed to order')
            })
    })
 }

[kris-erickson]

@dobbel Which layout is this added on, the default or the order layout? Does anyone know why it doesn’t work in the hooks?

[dobbel]

@kris-erickson

Which layout is this added on, the default or the order layout?

whatever layout is loaded first when your app starts ( that’s defined in your routes.js)

Btw Usually you don’t navigate directly to a layout but to one of it’s children (pages).

Does anyone know why it doesn’t work in the hooks?

what do you mean with ‘the’ hooks? Because the mounted method in my code block is a hook.

[kris-erickson]

@dobbel sorry I wasn’t being clear. I was talking about boot hooks (set up in quasar.conf.js boot: []). I don’t know why they don’t work there.

[dobbel]

@kris-erickson

I was talking about boot hooks (set up in quasar.conf.js boot: []). I don’t know why they don’t work there.

Maybe because the app is not loaded entirely yet. I btw removed the resolve() from my working code.