使用 router-link 跳转页面
时间: 2023-05-11 14:02:07 浏览: 106
可以使用以下代码实现 router-link 跳转页面:
<router-link to="/your-page">跳转到你的页面</router-link>
其中,"/your-page" 是你要跳转的页面的路径。你需要在路由配置中定义该路径对应的组件。
相关问题
router-link 跳转页面刷新
router-link 是 Vue.js 中用于创建链接的组件,用于实现页面之间的导航。它默认采用了前端路由的方式进行页面之间的切换,而不会触发整个页面的刷新。
如果你希望在点击 router-link 进行页面跳转时刷新页面,可以尝试以下方法:
1. 使用 key 属性:给 router-view 组件添加一个唯一的 key 值,当路由切换时,key 值发生变化,会触发组件的重新渲染,从而达到刷新页面的效果。例如:
```html
<router-view :key="$route.fullPath"></router-view>
```
2. 调用 window.location.reload() 方法:在 router-link 的点击事件中,手动调用 `window.location.reload()` 方法重新加载当前页面。例如:
```html
<router-link to="/home" @click="refreshPage">Home</router-link>
```
```javascript
methods: {
refreshPage() {
window.location.reload();
}
}
```
这样点击 router-link 时会触发页面的刷新。
希望对你有所帮助!如果有更多问题,请随时提问。
Vue2.0 router-link跳转页面
Vue2.0中的router-link可以通过to属性指定跳转的页面路径,例如:
```html
<router-link to="/home">Go to Home</router-link>
```
其中"/home"是你定义的路由路径。如果你使用了命名路由,也可以通过name属性指定跳转的路由名称,例如:
```html
<router-link :to="{ name: 'home' }">Go to Home</router-link>
```
阅读全文