Is vue-router a good way to get the absolute URL?

[julisch94]

Hey people,

TL;DR: Is Vue Router a good option to replace window.location calls?

I am working on a project where we need to read html snipped from a file.

This is an <b>example</b> for such a <a href="#" data-dialog-id="TAC">snippet</a>

My task is to replace the href="#" with the actual value. Currently we're manually finding that anchor tag in the html and replace:

const snippet = // read from file
const path = this.$route.path
const href = `${window.location.origin}${window.location.pathname}${window.location.search}#${path}?dialog=TAC`
snippet = snippet.replace('href="#"',`href="${href}"`)

After this the result anchor will look like this:
<a href="https://this.is.my.host/and/there/is/a/path/to/my/app#my-route?dialog=TAC" data-dialog-id="TAC">snippet</a>

I wish I could use <router-link> but it seems I can't just use router-link here. When I replace the a tag with router-link it adds a <router-link> tag to the DOM which is not what I want.

Since I'm basically simply adding a query param to the current route, I'm wondering if there is a way to simply add a query param to the very current route. It is important that I preserve the path under which my app is running.

[posva]

This sounds more like a plain one time js task, so I think it makes more sense to use the web and rely on window.location. Vue Router gives you a reactive location that can be used in your Vue app