So i tried to use Transition on routes changed. It works fine for normal transition, transition with mode='in-out'
but when i tried to use mode='out-in'
then when click link the current element did have the transisiton effect but then the destination route not show up like, disappear. i check on dev tools the node of that componenets not registered on the html tree also. It show now bug, no log no nothing so i don't know how to find the culprit. I recorded some videos hopefully someone might show me a way to find it.
Video 1: Normal Transition with no mode applied: https://streamable.com/ln6z5g
Video 2: Transition with mode='in-out'
applied: https://streamable.com/ta7gfw
=> The problem happend here:
Video 3: Transition with mode='out-in'
applied: https://streamable.com/ta7gfw
Try to find the problem, see what cause it but found none. Try to log onMounted, onUnMounted but no log show mean it not registered. Try to create a blank brandnew vue project and tried it but everything works fine. Try to look for html tree and vue dev tools but got nothing.
I found a thread about leaving a comment infront of template make transition count it as another node but i check mine and i have none. Link to topic
I would expect this transition effect will fade element A out and element B fade in. But instead elemant A out and element B would never come in.