我已经在Vue组件中进行了设置,
我的问题是,当我尝试更改其路线时,除非刷新页面,否则它不会呈现组件Goal.vue。我已经设置好了
:key
以及$forceUpdate
。但是,当我将其路由到this.$router.go(0);
之类的自身时,它可以工作,但是它有点难看,因为它喜欢两次渲染页面。
Evaluation.vue
<keep-alive>
<router-view :key="$route.fullPath"></router-view>
</keep-alive>
Dashboard.vue
<keep-alive>
<router-view :key="$route.fullPath" v-cloak></router-view>
</keep-alive>
和Goal.vue
就像
+--------------------+
| Evaluation |
| +----------------+ |
| | Dashboard | |
| | +------------+ | |
| | | | | |
| | | | | |
| | | Goal | | |
| | | | | |
| | +------------+ | |
| +----------------+ |
+--------------------+
这是我的路线
const ev = {
name: "evaluate_employee",
path: "evaluate_employee/:emp_eval_id?",
exact: true,
component: Evaluation,
meta: {
prefix: 'Evaluate Employee',
icon: 'person',
title: 'Evaluation - ',
permissions: ["auth"],
requiresAuth: false
},
children:[
{
name:'evaluating',
path:'evaluating/:eval_id?',
exact: true,
component: Dashboard,
meta: {
prefix: 'Evaluating User - ',
icon: '',
title: 'Evaluating - ',
permission:['auth'],
requiresAuth: false
},
children:[
{
name: 'eval_goal',
path: '', // evaluating/:eval_id?/
exact: true,
component: Goal,
meta: {
prefix: 'Performance Assessment - ',
icon: '',
title: 'Performance Assessment - ',
permission: ['auth'],
requiresAuth: false
},
},
]
},
]
}