Vue: once use vm.$destroy a router-component, keep-alive cached the component is not work anymore

[RunningV]

Version

2.3.3

Reproduction link

https://jsfiddle.net/RunningV/02txjwj1/2/

Steps to reproduce

detail handle steps to the link demohttps://jsfiddle.net/RunningV/02txjwj1/2/

What is expected?

only B>A destroy component B, don't impact C>B

What is actually happening?

when B>A destroy B, C>B will run all B's lifecycle

---

i learn vm.$destroy is not recommended to use manual destroy a component, then how can i init a cached component by use keep-alive ? Also how can i check which components have been cached by keep-alive ?

[yyx990803]

If you manually destroyed it, obviously it has to be created again... also, you should never manually call $destroy on a component mounted by Vue, you should only do this on a component you $mounted yourself.

My suggestion is using a computed property as the include prop for <keep-alive> to control what page should be kept-alive.

[RunningV]

thanks to ur reply@yyx990803 ,maybe i use vm.$destroy in a wrong way. but i think u didn't get the point what i mean. I only manual destroy B when B > A, but when click A > B >C >B again, B runs all the lifecycle. i think when A > B, B will be cached , then B > C > B will use the cached componentB . however, B will be created again. ps: B > C not trigger beforeDestroy & destroyed , why C > B triggered beforeCreated & created ?