when use appendchild in vueComponent,and via v-if to control component, get "Failed to execute 'insertBefore' on 'Node' "

[garfieldon757]

Vue.js version
2.6.3

`Modal.vue

<script> export default { mounted () { document.getElementById('app').appendChild(this.$el) } } </script>

Something.vue

Some text here

Show modal

<script> import Modal from './ui/Modal' export default { data: function () { return { showModal: false } }, components: { Modal } } </script>`

What is Expected?
When click on the close button, it should close the modal window.

What is actually happening?
Console shows me the error DOMException: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node.

[vue-bot]

Hello, thank you for taking time filling this issue!

However, we kindly ask you to use our Issue Helper when creating new issues, in order to ensure every issue provides the necessary information for us to investigate. This explains why your issue has been automatically closed by me (your robot friend!).

I hope to see your helper-created issue very soon!

[Justineo]

You may need to move the root node back to its original position in the beforeDestroy lifecycle hook.