19yuke2-project/19yuke2-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

pref: update transition

Browse Source
This commit is contained in:
thehrz 2023-08-13 15:46:30 +08:00
parent e2d80b78d8
commit 72267bc37c
Signed by: thehrz
GPG Key ID: C84CBCE7D5F88855
3 changed files with 11 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/App.vue
View File

@ -21,5 +21,9 @@ useHead({
</script>
<template>
<RouterView />
<router-view v-slot="{ Component, route }">
<transition name="fade" mode="out-in">
<component :is="Component" :key="route.path" />
</transition>
</router-view>
</template>

12
src/layouts/default.vue
View File

@ -2,13 +2,11 @@
<v-app class="flex flex-col">
<Nav />
<div style="--v-layout-top: 25px;--v-layout-bottom: 70px;">
<router-view v-slot="{ Component, route }">
<transition name="fade" mode="out-in">
<div :key="route.path" class="prose max-w-110ch m-auto p-3">
<component :is="Component" />
</div>
</transition>
<div>
<router-view v-slot="{ Component }">
<div class="prose max-w-110ch m-auto p-3">
<component :is="Component" />
</div>
</router-view>
</div>
</v-app>

10
src/layouts/index.vue
View File

@ -2,14 +2,6 @@
<v-app class="flex flex-col">
<Nav />
<div style="--v-layout-top: 25px" class="m-auto">
<router-view v-slot="{ Component, route }">
<transition name="fade" mode="out-in">
<div :key="route.path" class="prose max-w-110ch m-auto p-3">
<component :is="Component" />
</div>
</transition>
</router-view>
</div>
<router-view class="prose max-w-110ch m-auto p-3" />
</v-app>
</template>