VUEJS2.0.0.rc.2 vm.$destroy(true) does not work

[cnweibo]

Vue.js version

2.0.0.rc.2

Reproduction Link

https://jsfiddle.net/matiascx/apokjqxx/

Steps to reproduce

click the destroy A button in the fiddle

What is Expected?

A component is destroyed

What is actually happening?

when click the button, the following code will be executed:

this.$destroy(true)

Unfortunately the component is not destroyed as expected. In vuejs.1.0.26, that works well. Please check whether or not it is a bug of vue2.0 or something i have done wrong

[sqal]

Yeah, looks like this method is broken in 2.0

[yyx990803]

2.0 $destroy no longer accepts the argument for auto removal. Just remove the DOM node yourself.

[sqal]

wow ok thanks for pointing that out @yyx990803. But the remove parameter was acually a useful thing. Can you share the reason why it has been removed?

[cnweibo]

@yyx990803 , same question with sqal. Currently, i solve this in-compatible issue with additional code in addition to the vm.$destroy():

vm.$el.parentNode.removeChild(vm.$el)

It seems strange, i must append above code with vm.$destroy(true) itself If we can still support that parameter, it will be great thanks!~

[yyx990803]

@cnweibo fyi the usage in your fiddle will be considered bad practice in 2.0 - in general you should not manually destroy instances, or manipulate its DOM element when the instance is rendered by a parent component. This is why $destroy doesn't provide that argument anymore and methods like $remove, $appendTo are deprecated.

Again, the recommended usage is making it "data-driven", make the <ca> component controlled by a v-if in the parent scope, and toggle that v-if by emitting an event.

[posva]

Doing soa (as @yyx990803) makes your code more predictable too!

[cnweibo]

@yyx990803 @posva data-driven is nice in most cases. I also insist developing in the data-driven way. But in some cases, it is more reasonable and readable code to $destroy as VUE1.0 does. Anyway, just a proposal, if vuejs support $destroy(true) as 1.0 does, it is good, if you don't think they are necessary, that is also ok because we have alternative solution,

thanks~

[yyx990803]

@cnweibo If you want to control the lifecycle of a component manually, you have to do it ALL manually - which means you will create it using new, insert it yourself, and destroy/remove it yourself. What I would not recommend is mixing data-driven (using the component in a parent template) and imperative control (destroying it manually).

[cnweibo]

@yyx990803 , thanks for your clarification, i got it