N
Nuxt•2y ago
Displayray

Page Transition

I set my page transition like it is shown in the docs: 
.page-enter-active,
.page-leave-active {
  transition: all .7s;
}

.page-enter-from,
.page-leave-to {
  opacity: 0;
}

AND

pageTransition: {
      name: 'page',
      mode: 'out-in'
    },
.page-enter-active,
.page-leave-active {
  transition: all .7s;
}

.page-enter-from,
.page-leave-to {
  opacity: 0;
}

AND

pageTransition: {
      name: 'page',
      mode: 'out-in'
    },
I want to use that for all of my pages and it should work since im not using any layouts. My /pages looks like that [1]/pages/search/... [2]/pages/user/... When i switch a page in these folders everything works fine. Also when i go from / to [1] When i try to switch from [1] or from / to [2] the fadeout works but it pops directly in without a transition. Then when i want to navigato out of [2] to any other pages which isnt in [2], it simply doesnt show up. My screen just goes black. No special settings are done, im sure nothing affects the transition
1 Reply
Cue
Cue•2y ago
Would you mind creating a repro? https://nuxt.new
Start a Nuxt project
Start a Nuxt project
The best way to get started with a new Nuxt project.

Did you find this page helpful?