在Quasar外部组件中使用Vue路由器只会更改url，而不会更改页面本身.(打字)

Question

Helper函数---->

import route from '../router/index';

在此处添加存储TS限制的原因：

const router = route({
store: pinia,
})
export function RoutePusher() {
router.push({name: 'login'})
}

组件------->

<script lang="ts" setup>
import { RoutePusher } from 'src/helpers/file.ts';
function ComponentMethod() {
RoutePusher();
}
</script>

路由器------->

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.MODE === 'ssr' ? void 0 : process.env.VUE_ROUTER_BASE
),
});
return Router;
});

使用该方法后，只有url会更改，但页面不会更改。我也在我的布局中尝试过：

<router-view :key="route.fullPath"></router-view>

Answer 1

这对我很有效：

而不是

router.push({ name: 'login' });

使用

router.push({ name: 'login' }).then(()=>{router.go()});