美文网首页
vue通过监听实现相同路径的视图重新加载

vue通过监听实现相同路径的视图重新加载

作者: 爱余星痕 | 来源:发表于2018-10-27 21:00 被阅读0次

    最近在做一个项目,前端菜单路径如下:

    {
                    path: '/oa/workflow/process/:status',
                    component: sys_workflow_process,
                    name: '流程查询',
                    hidden: true
                },
                {
                    path: '/oa/workflow/process/1',
                    name: '待办流程',
                    component: sys_workflow_process,
                }
                ,
                {
                    path: '/oa/workflow/process/2',
                    component: sys_workflow_process,
                    name: '已办流程'
                },
                {
                    path: '/oa/workflow/process/3',
                    component: sys_workflow_process,
                    name: '全部流程'
                },
    

    菜单能正常显示,但发现从待办流程切换到已办流程时,页面没有重新刷新,但URL已经变化了.
    经查,是因为各个菜单路由是相同的,vue就会认为你是同一个页面,从而复用已加载的页面,而不会重新加载.
    解决办法如下:

      watch: {
                '$route' (to, from) {
                    //重新加载页面
                    this.switch(to.params['status']);
                 this.getDataList();
                }
            }
    

    这样,通过监听后,当路由URL发生变化时,重新加载视图

    相关文章

      网友评论

          本文标题:vue通过监听实现相同路径的视图重新加载

          本文链接:https://www.haomeiwen.com/subject/nyqjtqtx.html