完善路由

This commit is contained in:
LittleBoy 2022-12-05 10:41:10 +08:00
parent 14a47ff98d
commit c23309ca81
4 changed files with 10 additions and 6 deletions

View File

@ -157,4 +157,11 @@ const router = createRouter({
// 3.使用路由
const app = createApp();
app.use(router); // 在应用使用router
```
显示路由及跳转
```vue
<template>
<router-view />
<router-link to="要跳转的路径"></router-link>
</template>
```

View File

@ -3,10 +3,7 @@
<h1>vue3 + vite + {{ username }} {{ currentPath }}</h1>
<input type="text" v-model="username">
<template v-if="currentPath == '/home'">
<Home/>
</template>
<User v-if="currentPath == '/user'"/>
<router-view />
</div>
</template>

View File

@ -1,6 +1,6 @@
<template>
<h1>Home</h1>
<a href="#/user">User</a>
<router-link to="/user">User</router-link>
</template>
<script>

View File

@ -1,6 +1,6 @@
<template>
<h1>User</h1>
<a href="#/home">Home</a>
<router-link to="/home">Home</router-link>
</template>
<script>