Problems encountered in vue projects: DOMException

Question

When using vue to do a project, an exception is thrown:
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.

Description: This problem has been searched online before. It can be seen from many reference materials that it is related to v-if and v-show, but no detailed and reasonable explanation and solution have been given. I would like to raise the question here. , I hope fellow Taoists who have encountered the problem can give an explanation.

Answer 1

After searching for information:
https://github.com/vuejs/vue-...
https://github.com/vuejs/vue/...
You can refer to the above link.

I speculate that when the page Dom has not been rendered, the data returned by the http request is inserted into an unknown node, causing this error.

Scenario: Click the button to request data from the server, update vnode, and update the rendering results.
Solution: Add<p v-if="isShow"><p v-for=""></p></p> to the outer layer of the template that needs to be rendered, click the button to start When requesting data, @click="isShow=false". When requesting data successfully, cb(isShow=ture) in the callback function. Ensure that when updating data, remove first and then insert *