AppMain.vue 655B

123456789101112131415161718192021222324252627282930313233343536
  1. <template>
  2. <section class="app-main">
  3. <transition name="fade-transform" mode="out-in">
  4. <keep-alive :include="cachedViews">
  5. <router-view :key="key"></router-view>
  6. </keep-alive>
  7. </transition>
  8. </section>
  9. </template>
  10. <script>
  11. export default {
  12. name: "AppMain",
  13. computed: {
  14. cachedViews() {
  15. return this.$store.state.tagsView.cachedViews;
  16. },
  17. key() {
  18. return this.$route.fullPath;
  19. }
  20. }
  21. };
  22. </script>
  23. <style scoped>
  24. .app-main {
  25. /*84 = navbar + tags-view = 50 +34 */
  26. min-height: calc(100vh - 120px);
  27. position: relative;
  28. overflow: hidden;
  29. margin-top: 40px;
  30. background: #f6f8f9;
  31. }
  32. </style>