vue-router2.0 router-link怎么与组件结合使用？

Question

新版 vue-router 改用 router-link 代替原来的 v-link， 渲染时会根据需要渲染成 a 标签或其他标签。
那假如有个组件最外层就是 a 标签，
例如组件 App

<!-- App -->
<a>
    ...
    <slot></slot>
</a>

使用 App 组件时, 如何与 router-link 结合，实现点击组件跳转到对应地址？

补充：
例如App组件是写好的，现在使用App作为子组件，来实现组件B

<template>
<div>
    <div>...</div>
    <App>Go to ...</App>
</div>
</template>

如果想要点击组件App，进行跳转，使用vue-router如何实现？

Answer 1

模版中指定路径<router-link to="/foo">Go to Foo</router-link>

定义组件模版const Foo = { template: '<div>foo</div>' }

定义路由，加载模版const routes = [
{ path: '/foo', component: Foo },
{ path: '/bar', component: Bar }
]

挂载路由后就可以了。看 Vue-router2 文档上写的很清晰。