Is it possible to use route.meta property outside of the component?

I am using Vue 3 in my project and I used route.meta property inside the Vue component but when I moved that into .ts file it doesn’t work anymore and in-browser appeared an error.

My .ts file:

import { useRoute } from "vue-router";
import { computed } from "vue";

const route = useRoute();

export const myfunction = computed(() => {
  return route.meta.somedata;
});

Error from the browser:

Uncaught (in promise) TypeError: Cannot read property 'meta' of undefined

The same code works fine in .vue files.
Is there any way to use meta property outside of the .vue file?

30 thoughts on “Is it possible to use route.meta property outside of the component?”