Блог

У меня это настроено в моих компонентах Vue,

Моя проблема в том, что он не отображает компонент Goal.vue, когда я пытаюсь изменить его маршрут, если я не обновил страницу. Я уже выполнил настройку :key , а также $forceUpdate . Тем не менее, он работает, когда я направляюсь к нему самостоятельно, как this.$router.go(0); но это немного уродливо, потому что это похоже на рендеринг страницы дважды.

Оценка.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
          },
        },

      ]
    },
  ]
}