vue3.0 router-link
时间: 2023-09-09 07:07:39 浏览: 133
【JavaScript源代码】vue3.0+vue-router+element-plus初实践.docx
5星 · 资源好评率100%
Vue 3.0 中的 `router-link` 组件用于在 Vue Router 中创建导航链接。它提供了一种简便的方式来在应用程序中进行页面导航,而无需直接操作 URL。
下面是一个示例:
```html
<template>
<div>
<router-link to="/home">Home</router-link>
<router-link to="/about">About</router-link>
<router-link to="/contact">Contact</router-link>
</div>
</template>
```
在上面的代码中,我们使用 `router-link` 组件创建了三个导航链接:Home、About 和 Contact。`to` 属性指定了链接的目标路径。
当用户点击链接时,`router-link` 会自动处理导航,并且在应用程序中加载相应的组件。
请注意,为了使用 `router-link` 组件,你需要先安装并配置 Vue Router。在 Vue 3.0 中,你可以通过 `createRouter` 方法来创建路由实例,并将其与应用程序实例关联起来。
希望这个回答能够帮助到你!如果你有任何其他问题,请随时提问。
阅读全文