Isotope collapses when changing route

[guanzo]

Hi, i have an isotope layout on one of my vue-router routes. Whenever i leave this route, the layout visibly breaks during the route transition. The isotope styles are removed, and the elements are just stacked column wise as standard, block layout divs.

This is the route transition css.

.fade-enter-active, .fade-leave-active{
  transition: .5s;
}

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

.fade-enter-active {
  transition-delay: .5s;
}

The broken layout is visible for half a second, which is more than enough time for the user to go, "huh?".

What can i do to fix this?

[David-Desmaisons]

Hello @guanzo , I have too few information to provide a helpfull comment here. I f you are able to isoltae the problem and create o jsfiddle I will investigate.

[rizzmoe]

You can use the keep-alive tag around the router view

`

`

This way the Isotope Component stays rendered inside Memory and won't collapse on change of route (isn't destroyed anymore)

[David-Desmaisons]

Corrected in version 3.1.2