最近在做一个项目,前端菜单路径如下:
{
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发生变化时,重新加载视图