2017-01-30 47 views
0

开发任务调度路径“/任务?ID = 10”填充与该任务信息的异步​​响应,该工程确定的组件模型中的Vue组件清算模式。声明路由器链路不使用VueRouter

在导航栏我有以下的路由器链接:

<router-link to="/task">New Task</router-link> 

中,如果“ID”参数存在所以我使用了创建新任务和编辑现有的所有基于相同的路径和组件或不。

问题是,如果我在路径'/任务?id = 10',我填充一些模型字段,然后我点击路由器链接指向'/任务'(没有参数)它改变了浏览器的URL但它不清除组件模型,因此输入数据仍然存在。

我怎样才能重新启动/重新加载组件通过声明路由器链接登陆的时候吗?

回答

1

您可以制作父子组件。父组件在/任务路线上,孩子将在'/ task/10上。更多,Nested Routes。此外,您不需要追加'?id =',只需/任务/ 10。

const router = new VueRouter({ 
    routes: [ 
    { path: '/task', component: Task, 
     children: [ 
     { path: ':id', component: TaskId } 
     ] 
    }] 
}); 

jsfiddle