Vue路由更改,但页面信息显示以前的路由详细信息

我有一个标题,有多个指向不同页面的链接,当我单击一个链接时,正文中的内容会按预期更改,但当我单击一个diff标题链接时。我看到路由url已正确更改,但正文内容显示前一个链接。一旦我点击刷新我看到适当的身体内容,我期待。我不确定问题是与HTML绑定有关,还是与如何加载显示正文内容的Vue组件有关。

所以我的想法是我有标题链接,显示在所有网页:班级,老师,学生。当我点击“教师”时,我会得到要出现在正文中的教师列表。当我点击学生时,我看到了学生的url改变,但我仍然看到了教师的内容。一旦我点击刷新我看到学生的内容。

页眉:

ul
 li(v-for='link in links')
  router-link(:to='{name: "LinkPage", params...}'){{link.name}}

在我的视图页中,我有:

h1 {{link.name}}

在我的剧本里:

  beforeMount(){
  //api to make call to get the details for the selected link and set it to link property which i used to load html. 
}