You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Step 1:
Click on any category link. The background turn to pink and the text grows. After 2 seconds the transition finishes, the user is redirected to the next page.
Step 2:
Click on Home, and than click on any category link.
What is expected?
The css class name should turn to active for the clicked link at step 2 the same way as it happens at step 1
What is actually happening?
At step 2 the css class is not set. The background color and the text size does not change.
The active variable is set on click, but it seems the :class binding does not get it only for the very first time. Tested on Arch Linux with Chromium 90.0.4430.85 and Firefox Developer Edition 89.0b4
I have animations what should run when the user clicks a link for the link they clicked on.
The text was updated successfully, but these errors were encountered:
This is just how Vue transition work: they trigger at the same time you change the active class, so they never render after the change except for the first time because it needs to fetch the About page and Vue has the time to render once.
You can force this by waiting a tick but it's something you have to do on your own
Version
3.5.1
Reproduction link
https://codesandbox.io/s/vue-routing-example-forked-2ggs5?file=/views/Home.vue
Steps to reproduce
Step 1:
Click on any category link. The background turn to pink and the text grows. After 2 seconds the transition finishes, the user is redirected to the next page.
Step 2:
Click on Home, and than click on any category link.
What is expected?
The css class name should turn to
active
for the clicked link at step 2 the same way as it happens at step 1What is actually happening?
At step 2 the css class is not set. The background color and the text size does not change.
The
active
variable is set on click, but it seems the:class
binding does not get it only for the very first time. Tested on Arch Linux with Chromium 90.0.4430.85 and Firefox Developer Edition 89.0b4I have animations what should run when the user clicks a link for the link they clicked on.
The text was updated successfully, but these errors were encountered: