天天看點

疑惑:[Vue warn]: Error in nextTick: “NotFoundError: Failed to execute ‘insertBefore‘ on ‘Node‘:

問題:

[Vue warn]: Error in nextTick: “NotFoundError: Failed to execute ‘insertBefore’ on ‘Node’: The node before which the new node is to be inserted is not a child of this node.”

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 warn]: Error in nextTick: “NotFoundError: Failed to execute ‘insertBefore‘ on ‘Node‘:

參考:

vue架構中提供了v-if 和 v-show兩個指令,用于控制頁面不DOM結構的顯隐性。

相同點:均可以實作局部DOM的顯示和隐藏

不同點:顯示和隐藏的原理不同。v-show隐藏元素的本質是給元素本省添加了display = none這個css屬性,其實DOM結構仍存在于頁面,可以通過F12檢視DOM結構。v-if隐藏元素的本質是不加載DOM結構,不能通過F12檢視DOM結構之後再v-if綁定的布爾變量為true時,才添加對應的DOM結構。

參考文章:https://www.jianshu.com/p/9b95705b098e

我的問題代碼:

邏輯:定義isProcessUpload:false,點選按鈕後,isProcessUpload=true,就報錯了。

父元件:

疑惑:[Vue warn]: Error in nextTick: “NotFoundError: Failed to execute ‘insertBefore‘ on ‘Node‘:

子元件:使用了visible屬性去控制顯隐

疑惑:[Vue warn]: Error in nextTick: “NotFoundError: Failed to execute ‘insertBefore‘ on ‘Node‘:

解決:

把v-if改成:visible,沒報錯且正常了。

這為什麼呢?

疑惑:[Vue warn]: Error in nextTick: “NotFoundError: Failed to execute ‘insertBefore‘ on ‘Node‘:

繼續閱讀