Questions tagged [vue-router4]
190 questions
6
votes
1 answer
Use vue router (v4) in a plain .js file with Quasar framework (v2)
I'm trying to access the router from a plain .js file in a Quasar project but I'm not being able to. I have search how to do it in vue and people seem to import the Router object from /src/router/index, like this: import { Router } from…

Héctor
- 399
- 3
- 16
5
votes
2 answers
The recommended way to load route data before entering the route?
Before rendering a page for a given route, I'd like to synchronously fetch the necessary data first. Ideally, I'd like to have the data fetching within the page component, but I'm not opposed to doing it in the router files. I've read and tried…

kenshin9
- 2,215
- 4
- 23
- 38
5
votes
1 answer
Typescript | Vue3 - How a specific route param can return a array of strings?
Consider this build error:
src/views/IndividualProgramView.vue:18:63 - error TS2345: Argument of type 'string | string[]' is not assignable to parameter of type 'string'.
Type 'string[]' is not assignable to type 'string'.
18 const ProgramForm =…

Riza Khan
- 2,712
- 4
- 18
- 42
5
votes
7 answers
ncaught TypeError: Cannot use 'in' operator to search for 'path' in undefined vue router
when I am randomly moving from one component to another on any point vue gives this error and then i can not move another component.
This error is not on any specific component it can happen anywhere.
error
Uncaught TypeError: Cannot use 'in'…

Bilal Arshad
- 531
- 3
- 11
- 33
5
votes
1 answer
Vue 3 - Get access to router-view instance in order to call child methods
I’m trying to migrate a Vue 2.x app to Vue 3.x.
Unfortunately, for the past two days, I’m struggling to find working solution to this simple issue :
My application is for mobile device and, at the top of the screen, I have a top bar with 2…

SebT
- 135
- 2
- 6
5
votes
1 answer
Vue router addRoutes deprecated but I want to add array of routes to Vue router
This is my Main.js. I'm fetching routes from the database through an API call but Vue router version 4 deprecated addRoutes functionality. So now I can add only one route at a time. I don't want to add routes by iterating the routes/menu list.…

Jithin Vijayan
- 307
- 5
- 19
5
votes
0 answers
Vue test utils with Vue-router4 and Vue3 Composition API
I am unable to mount a component during unit testing due to the the route object being undefined in the setup method during mounting. The guides seem aimed at Vue2 and the options API
References:
How to write test that mocks the $route object in…

shoop
- 285
- 3
- 11
5
votes
1 answer
Vue.js 3 - Trying to build a system with 2 layouts
I am a beginner with vue.js (3)
I try to build a system with 2 layouts :
1 for a connected user
1 for a not connected user
In my router/index.js, I add a meta for each route :
const routes = [
{
path: '/',
name: 'Home',
meta: {…

Dom
- 2,984
- 3
- 34
- 64
4
votes
2 answers
error while using params in the router.push function vue-router 4
hello guys i'm new to vue js and i'm trying to pass paramenters to a specific router this should happen when i click on a card research and then it will redirect to the research details component called actions-log but when i call this router…

nerween
- 41
- 1
- 7
4
votes
2 answers
Vuejs 3 Router Cannot read property 'push' of undefined
I am currently trying to start a Vue app which will contain a user login.
For some reason the I have been struggling with getting this router redirect to work.
The implementation is straight from the vueschool page and specifically aimed at the…

Controvi
- 487
- 1
- 6
- 16
4
votes
1 answer
Vue 3 router - router-link-active not working
In vue 3 with router 4 the class router-link-active isn't working anymore for me. The class appears if u are on the same page, together with router-link-exact-active, but not on any subpages.
For example the link

Christopher Adels
- 345
- 3
- 14
4
votes
1 answer
Pass an object as param to router.push (vue-router@4.05)
Problem
router.push({name:"Order", params: {obj: {}})
fails to push obj: {}, instead the route receives obj: '[object Object]'
Situation
I have a route setup like this
{
path: '/Order',
name: 'Order',
component: () =>…

Shane Abram Mendez
- 395
- 5
- 18
3
votes
1 answer
Nuxt 3 Routing : "Simple" dynamic route return 404 error
I'm trying to make a simple dynamic link with nuxt3 ("3.0.0-rc.3") and I cannot reach dynamic slug url. I followed this page but it doesn't seem to work for me :
https://nuxtjs.org/examples/routing/dynamic-pages
Here is my simple page structure…

Antoine Cantoro
- 33
- 1
- 5
3
votes
1 answer
Why passing data through Vue-router returning "[object Object]"?
What I'm trying to do is to pass some data from one component to another via router (I'm using Vue-Router-4 with Vue 3.0). But the data that I'm getting back is just "[object Object]" instead of the actual value. Here is what I did. Inside the…

Samakaab
- 131
- 1
- 10
3
votes
2 answers
Vue 3 dynamic components at router level
Dynamic imports is needed for me, eg. i have 10 layouts, but user only visited 3 layouts, I should not import all of the layouts, since its consumed unnecessary resources.
Since its dynamic import, each time i switch between Login & Register path…

LI HO TAN
- 113
- 3
- 11