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> </script>
<template> <template>
<RouterView /> <router-view v-slot="{ Component, route }">
<transition name="fade" mode="out-in">
<component :is="Component" :key="route.path" />
</transition>
</router-view>
</template> </template>

12
src/layouts/default.vue
View File

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

10
src/layouts/index.vue
View File

@ -2,14 +2,6 @@
<v-app class="flex flex-col"> <v-app class="flex flex-col">
<Nav /> <Nav />
<div style="--v-layout-top: 25px" class="m-auto"> <router-view class="prose max-w-110ch m-auto p-3" />
<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>
</v-app> </v-app>
</template> </template>