路由組件: Home.vue

// Home.vue
<template>
  <div class="home">
    <h3>{{ msg }}</h3>
    <ul class="exam-list">
      <li>{{ test }}</li>
      <li v-for="exam in exams">{{ exam.examName }}</li>
    </ul>
  </div>
</template>

<script>
import examModel from '@/model/exam-model'

let exams = [{ examName: '加載中...' }]

export default {
  name: 'home',
  props: ['test'],
  data () {
    return {
      msg: '首頁(yè)',
      exams
    }
  },
  beforeRouteEnter (to, from, next) {
    examModel
      .queryExamList()
      .then(res => {
        console.log('beforeRouteEnter', res)
        exams = res.data
      })
    next()
  }
}
</script>

本來(lái)是想路由在匹配到 /home 時(shí)，異步請(qǐng)求后端數(shù)據(jù)，請(qǐng)求成功后，更新考試列表
但事實(shí)是，直接在 /home 頁(yè)刷新頁(yè)面，請(qǐng)求成功，但視圖不會(huì)更新，點(diǎn)擊其他 route 再返回回來(lái)，就更新了

問(wèn)題應(yīng)該是出在 beforeRouteEnter 方法，因?yàn)樵谡{(diào)用該方法時(shí)，不能獲取組件實(shí)例 this（組件實(shí)例還沒(méi)被創(chuàng)建），文檔里也沒(méi)有看到 afterRouteEnter 方法，那怎么實(shí)現(xiàn)這樣的需求呢？