Error while running $router.push in Vue js 3 Vite

Question

I have crated one route for Login. But it gives error in router.push

{ path: '/login', component: () => import('pages/LoginPage.vue'), name:'Login', props: true },

When I do router.push

this.$router.push({ name: 'Login', params: { test: 'eduardo' }, replace: true })

it gives error.

[Vue Router warn]: Discarded invalid param(s) "test" when navigating.

boot file

import { route } from 'quasar/wrappers'
import { createRouter, createMemoryHistory, createWebHistory, createWebHashHistory } from 'vue-router'
import routes from './routes'

/*
 * If not building with SSR mode, you can
 * directly export the Router instantiation;
 *
 * The function below can be async too; either use
 * async/await or return a Promise which resolves
 * with the Router instance.
 */

export default route(function (/* { store, ssrContext } */) {
  const createHistory = process.env.SERVER
    ? createMemoryHistory
    : (process.env.VUE_ROUTER_MODE === 'history' ? createWebHistory : createWebHashHistory)

  const Router = createRouter({
    scrollBehavior: () => ({ left: 0, top: 0 }),
    routes,

    // Leave this as is and make changes in quasar.conf.js instead!
    // quasar.conf.js -> build -> vueRouterMode
    // quasar.conf.js -> build -> publicPath
    history: createHistory(process.env.VUE_ROUTER_BASE)
  })

  return Router
})

I guess you need to add :test to the path in your routes. With params your using dynamic routing. Maybe you want to use query instead of params, looking at your use case. — Gabe, Nov 16 '22 at 05:38
I don't think it's required. https://stackoverflow.com/a/45151854/9272654 — Pratik Patel, Nov 16 '22 at 05:43
That’s an answer from 2018. I think handling props has changed since than. https://router.vuejs.org/guide/essentials/passing-props.html — Gabe, Nov 16 '22 at 05:49
But then I think the problem is Let's say I pass dict and it will still treat as string not object — Pratik Patel, Nov 16 '22 at 05:58
Do you even need `props: true`? Maybe it expects something else than `true`, like `'test'`? https://v3.router.vuejs.org/api/#route-object-properties Also, with Quasar you maybe [don't even need to specify those](https://quasar.dev/layout/routing-with-layouts-and-pages#introduction) as with Nuxt? — kissu, Nov 21 '22 at 03:28

Error while running $router.push in Vue js 3 Vite

0 Answers0