Question

可能有人问过这个问题，但我找不到解决方法。我有一个加载左导航提示的索引页面。在该视图上是带有名称的预输入。选择名称后，将调用一个函数，并将唯一值作为pmid_list传递

        this.$router.push({ name: 'About', params: { pmid_list: item.PMID_Include } }

这第一次工作正常，因为已加载About vue，并且使用pmid_list值调用了该函数。如果在两次通话之间刷新页面，则每个名称都可以正常工作。如果我不刷新，则将正确的pmid_list（参数）发送到路由器，但如果vue组件未更改，则路由器决定发送旧的pmid_list。

从我读到的内容来看，这是路由器问题，但是我不知道如何强制刷新。

           export default new Router({
           mode: 'history',
           routes: [
                 {
                   path: '/about/:pmid_list',
                   name: 'About',
                   component: About,
                   props: {default: true}
                   }

Answer 1

About组件正在被缓存。

使用带参数的路由时要注意的一件事是，当用户从/ user / foo导航到/ user / bar时，相同的组件实例将被重用。组件，这比销毁旧实例然后创建新实例更有效。 但是，这也意味着该组件的生命周期挂钩将不会被调用。

Dynamic Route Matching

如文档中所示，您应该使用watcher对参数更改做出反应：

watch: {
  '$route' (to, from) {
    // react to route changes...
  }
}

Answer 2

您可以尝试查看路线更改。

watch:{
    '$route.params.pmid_list': function (pmid_list) {
        //your logic here
    }
},

刷新Vue上的数据

2 个答案: