How to open a specific route in an Electron BrowserWindow?

mitchartemis

Hi!

I’m working on an Quasar Electron app that has a button which needs to show a specific route in a pop-up window.

So far, I have tried a generic <a> tag with _blank, and also tried opening a new BrowserWindow by using ipcMain and ipcRenderer but the page that loads is empty.

I have tried opening ${__dirname}/index.html#/page and although the basic HTML seems to show when I inspect it (I.e. the #app element and core head/body stuff) none of the Vue DOM shows.

Does anyone know how I can achieve this?

Thanks!

dobbel

@mitchartemis

https://quasar.dev/quasar-utils/other-utils#Open-External-URL

mitchartemis

@dobbel thanks, but unless I’m mistaken this is for opening an external website URL. I am trying to open an internal URL.

dobbel

@mitchartemis

https://quasar.dev/vue-components/button#Example--Links

just use the to attribute

mitchartemis

Thanks for the link @dobbel

I see there’s an on-click event that can be used as well. Is it possible to alter the url it’s going to when clicked?

When I click the link/button, I want to fetch a unique ID from my API, and then open the route in a new window with the route parameter generated from the API.

dobbel

@mitchartemis

Yes of course, there are multiple ways to do this.

you can use the vue router to fetch/do something before it goes to a route. (probably best option )
https://medium.com/js-dojo/vue-router-route-resolvers-e7d09c991b58
Remove the button to url . Replace it with a @click event to the button. Then in the clickhandler: make a call to your api and on succes, do a router.push({name: 'you-route', params:{foo:'bar'}}).
https://stackoverflow.com/questions/40382388/how-to-set-url-query-params-in-vue-with-vue-router