blackteay/vue-antd-admin
1
0
Fork 0
mirror of https://github.com/iczer/vue-antd-admin synced 2025-04-06 04:00:06 +08:00
Code Issues Projects Releases Wiki Activity

修复: 解决部分页面切换动画抖动问题;

Browse Source
This commit is contained in:
iczer 2020-06-18 20:02:16 +08:00
parent a73159aef8
commit 94096a3832
3 changed files with 13 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/transition/PageToggleTransition.vue
View File

@ -76,12 +76,12 @@
.page-toggle-enter-active{ .page-toggle-enter-active{
position: absolute !important; position: absolute !important;
animation-duration: 0.6s !important; animation-duration: 0.6s !important;
width: calc(100% - 48px); width: calc(100%);
} }
.page-toggle-leave-active{ .page-toggle-leave-active{
position: absolute !important; position: absolute !important;
animation-duration: 0.6s !important; animation-duration: 0.6s !important;
width: calc(100% - 48px); width: calc(100%);
} }
.page-toggle-enter{ .page-toggle-enter{
} }

19
src/layouts/MenuView.vue
View File

@ -14,12 +14,14 @@
<span slot="tab" :pagekey="page.fullPath">{{page.name}}</span> <span slot="tab" :pagekey="page.fullPath">{{page.name}}</span>
</a-tab-pane> </a-tab-pane>
</a-tabs> </a-tabs>
<page-toggle-transition :animate="animate.name" :direction="animate.direction"> <div class="menu-view-content">
<keep-alive v-if="multiPage"> <page-toggle-transition :animate="animate.name" :direction="animate.direction">
<router-view /> <keep-alive v-if="multiPage">
</keep-alive> <router-view />
<router-view v-else /> </keep-alive>
</page-toggle-transition> <router-view v-else />
</page-toggle-transition>
</div>
</global-layout> </global-layout>
</template> </template>
@ -160,8 +162,7 @@ export default {
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
.menu-view{ .menu-view-content{
.menu-view-content{ position: relative;
}
} }
</style> </style>

2
src/layouts/PageLayout.vue
View File

@ -67,7 +67,7 @@ export default {
} }
.page-content{ .page-content{
position: relative; position: relative;
padding: 24px 24px 0; padding: 24px 0 0;
&.side{ &.side{
} }
&.head{ &.head{