how to use "router.push " outside vue component in the js class?

[nekooee]

Hi,

I used the latest version of the quasar framework in CLI mode. (V2.9.2)
my index.js for route code:

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

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,
    history: createHistory(process.env.VUE_ROUTER_BASE),
  });

  return Router;
});

and my class in "src/js" folder:

import { api } from "boot/axios";

class Auth {
  logout() {
    localStorage.clear();
    localStorage.removeItem("token");
    localStorage.removeItem("user");
    this.user = null;
    router.push({ name: "login" });
  }
}
export default new Auth();

but router.push doesn't work. how to use router push outside vue component?

[Junvary]

try this:

import { useRouter } from 'vue-router';

const router = useRouter();
router.push({ name: "login" });

[nekooee]

try this:

import { useRouter } from 'vue-router';

const router = useRouter();
router.push({ name: "login" });

No, this code only works correctly when written in a vue component. It gives the following error outside the component:

 inject() can only be used inside setup() or functional components
TypeError: Cannot read properties of undefined (reading 'push')

[metalsadman]

export your router instance and import it where you want to use it outside of vue files.