How to use useRoute() in nuxt?

[HendrikJan]

I'm stuck trying to get a query parameter from the current url.

Normally, I would use useRoute(), but I cannot find out how to load useRoute.

Try to use useRoute directly:

/* /server/helpers/myHelper.ts */
const route = useRoute(); // <-- error: "useRoute is not defined"

Try to import from "#imports" or "#app":

/* /server/helpers/myHelper.ts */
import { useRoute } from '#imports'; // <-- error: "'useRoute' is not exported by virtual:#imports"
import { useRoute } from '#app'; // <-- error: "'nuxt app instance unavailable"

Or try to import from "vue-router":

/* /server/helpers/myHelper.ts */
import { useRoute } from 'vue-router';
// Error:
// Named export 'useRoute' not found.
// The requested module 'node_modules/vue-router/dist/vue-router.common.js' is a CommonJS module

And finally trying using common.js syntax:

/* /server/helpers/myHelper.ts */
import vueRouter from 'vue-router';
const { useRoute } = vueRouter; // <-- error: Property 'useRoute' does not exist on type 'typeof VueRouter'

So my question: how can I get the query parameters of the current url?

[HendrikJan]

I found that you now can use functions from unjs/h3 like so:

import { getQuery } from 'h3'

const lang = getQuery(event).lang; // <-- get the "lang" parameter from the query
console.log('language is set to:', lang)