Version

3.2.26

Reproduction link

github.com

Steps to reproduce

provide two ways.

first: with vue-router@next click 'To Test2' click 'To Test1' click 'To Tesr2'

second: without vue-router click 'show Test4' click 'show Test3' click 'show Test4'

What is expected?

first: with vue-router@next click 'To Test2' // console Test1 isDeactivated true click 'To Test1' // console Test1 isDeactivated false \nTest2 isDeactivated true click 'To Tesr2' // console Test1 isDeactivated true \nTest2 isDeactivated false

second: without vue-router click 'show Test4' click 'show Test3' // console Test3 isDeactivated false click 'show Test4' // console Test4 isDeactivated false

What is actually happening?

first: with vue-router@next click 'To Test2' // console Test1 isDeactivated false click 'To Test1' // console Test1 isDeactivated true \nTest2 isDeactivated false click 'To Tesr2' // console Test1 isDeactivated false \nTest2 isDeactivated true

second: without vue-router click 'show Test4' click 'show Test3' // console Test3 isDeactivated true click 'show Test4' // console Test4 isDeactivated true

Actually, when add nextTick, it will show correctly, it may caused by keep-alive which post last queue

I don't see this why this should be seen as a bug. You should not be relying on

1. internal APIs like instance.deactivated
2. assumptions about timing in Vue's asynchronous update process that are not documented.

You should rather be using onActivated/onDeactivated to react to when an instance is actually being (de-)activated