vuejs
Vue Transition component problem
Transition component is useful to make a effect ，but it has a speechless problem, transition component just can has one root (without annotations)。It is better to mark this problem in the document
The following conditions are displayed normally for the first time， But it will not be displayed after switching other pages，After refreshing, the page is normal
The relevant bit in the documentation is this:
https://vuejs.org/guide/built-ins/transition.html#the-transition-component
However, I'm unclear from your description whether this is the problem you're reporting, or if you're having some other problem with <Transition> behaving differently in a specific scenario. The problem you're describing might be a bug rather than a documentation problem, but I can't be sure from your description.
For Example, Build a simple project , the App.vue like this :
vue-router:
Page A:
Page B:
Can work normally， but the page A change a little like this:
The Page A can load for the first time, but i want to load the Page B, it can not load：
Reload the Page A, it can not load:
I can refresh the web to load the Page A, it can load again. This is a strange phenomenon. All questions come from Page A, it has a annotation.
The Transition component must also have only one single root element, Does it exclude annotation?
I tried recreating this in the SFC Playground but it worked fine in the cases I tried:
I don't believe there's a documentation problem here.
If you believe there's a bug, either with Vue core or Vue Router, then I suggest opening a bug report against the relevant repository. You'll need to create a proper reproduction though, as it isn't practical to investigate these kinds of problems using screenshots of code.
I tried recreating this in the SFC Playground but it worked fine in the cases I tried:
https://sfc.vuejs.org/#eNp9kj1zwjAMhv+K6oX2jsR7ztAGxq6MXiCIYBp/nO2kA5f/XjsO0IRrp0TS60fyK19JaUzetUgKwlxlhfHg0LdmzZWQRlsPV7B4gh5OVktYBOniXtqeRXMsx0pOUxhpM8lmKtmMEgCuKq2cB+lqWMU+r962+MYVo2mYMEYIPErT7D2GCIDt7F454YVWQxwyn4imbESXBEOq0qG/QuWhEG7FSezwfhu4GMfiZM3oXXmj0SmO0VlDdmi91wo+qkZUXyN7BS/hE4AJstN13WA6nuShwOj9ImRJkkGZ3Jv84rQKC7gOlowFx0kBQybmgmEx5uTsvXEFpe5URRcvLte2puEvt63yQmKOTmYHq78d2gDmZPmLQUOyQ5tZVEe0aP9jzqRP3IjtuerDVR6Lj89ouq2XLIOtljKuIstS7ii60afhJJTJqJSeuvR4MM/oOWbzF6b/AQo+98g=
I don't believe there's a documentation problem here.
If you believe there's a bug, either with Vue core or Vue Router, then I suggest opening a bug report against the relevant repository. You'll need to create a proper reproduction though, as it isn't practical to investigate these kinds of problems using screenshots of code.
There's not a documentation problem here. I just suggest the document should clearly explain the problem for the root element and annotation
I think It is a bug here .
I do not know how to use Vue SFC Playground, so I provide a project address: https://github.com/numver/Test-Project.git
Or codesandbox : https://codesandbox.io/s/vue-router-playground-forked-671bgz?file=/src/App.vue