How can I get window.location.href in Nuxtjs V3-CodePudding

I'm trying to let players join a game via QR Code. Since that game will be hosted on several IP's, i want to dynamically generate the URL.

This is my current workaround in my NuxtJS Vue Component:

<template>
    <input placeholder="copy browser window url into this field" v-model="fullPath" @change="generateQR">
</template>

<script setup>
    const fullPath = ref(null)
    QRCode.toDataURL(fullPath.value   ...
</script>

What I want to do is something like:

<script setup>
    // not working phantasy code
    QRCode.toDataURL(window.location.href   ...
</script>

When using useRouter() and useRoute()'s .fullPath attribute, I still only get the relative path / instead of http://10.16.1.173:3000/.

Any help would be highly appreciated.

Thank you!

Full code on GitLab: pages/index.vue

CodePudding user response：

Try to check if you are in client side before accessing to 'window' object, you can use :

if (process.client) {
      console.log(window.location.href)
}

CodePudding user response：

Try to use this:

this.$route.query