为什么一条路线没有反应性?

问题描述 投票:0回答:1

作为我的QuasarApp的一部分,我有以下路线:

import { RouteRecordRaw} from 'vue-router' import { uid } from 'quasar' const routes: RouteRecordRaw[] = [ { path: '/', redirect: () => { console.log('matched /') return {path: `/${uid()}`} } }, { path: '/:uuid', component: () => import('pages/User.vue') // component: User, }, ]; export default routes;
to当to
/

时工作正常:将URL更改为

/73a219e5-2cf2-4dd0-8...
,并且执行了(特别是内部有一个基于
User.vue
参数的数据,该
fetch
在其中检索了一些数据。
如果我从组件内强迫路线(例如
:uuid
),via

User.vue

我确实看到URL更改为新的UUID,但没有执行
import { useRouter } from 'vue-router' const router = useRouter() router.push('/')

。具体而言,提到
User.vue
没有反应性的参考。

是这种正常的(=我必须寻找触发方法),还是我身边有滥用(错误用途)?

	
问题的核心是您使用相同的组件来渲染您要导航的页面
from

和您正在导航的页面。

通过设计,VUE优化了DOM渲染,并将重复使用现有的组件实例。这意味着在更改路线时不会触发某些钩子(例如:

route.params.uuid
vue.js routes vuejs3 vue-component
1个回答
5
投票
const route = useRoute()

等)。 在路由更改时,强迫创建不同的组件实例,请使用当前路由的mounted用作created.fullPath

key

	
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.