How to get rid of get params route returns undefined

Tutorials
1

Hi,

Since I tried various methods to retrieve the parameters of the current route:

{
    path: '/orders/:ordersId/',
    name: 'orders-detail',
    component: DetailOrders,
}

with these Vue tips:

  • props.f7router.params.ordersId → returns undefined
  • props.f7router.currentRoute.params.ordersId → returns undefined

both return UNDEFINED, leaving me feeling quite desperate. Then, I revisited the initial setup of the F7 project and noticed that the setup URL had parameters. After some investigation, I discovered that I needed to use props.f7route instead of props.f7router!

I changed my code from:

props: {
    f7router: Object,
}

to:

props: {
    f7route: Object,
}

and props.f7route.params.id is the key!
as you can see in /src/pages/product.vue

Hope this information is helpful.

1 Like
2

Hey everyone,
I ran into the same issue recently, where trying to access GET parameters from the route was returning undefined. After some digging, here’s what helped me fix it:

  1. Double-check your route definition – Make sure you’re using the right syntax, especially if you’re using frameworks like Express, Next.js, or React Router.
    For example, in Express:

js

CopyEdit

app.get('/your-route', (req, res) => {
  console.log(req.query); // should return your GET params
});
  1. For Next.js, if you’re using the useRouter() hook, remember:

js

CopyEdit

const router = useRouter();
const { id } = router.query; // make sure you're accessing after router is ready
  1. Ensure you’re on the client-side (if applicable) – Sometimes router.query is undefined on the first render (especially in Next.js). You can guard against this using:

js

CopyEdit

useEffect(() => {
  if (router.isReady) {
    console.log(router.query);
  }
}, [router.isReady]);
  1. Check your URL structure – Sometimes a missing ? or incorrect parameter name leads to this. Make sure you’re accessing the param with the correct key.

Hope this helps someone else facing the same issue! Let me know if you’re using a specific framework and I can help dig deeper. :+1: