DOMException: Failed to execute 'insertBefore' on 'Node
问题： 用v-if 控制弹框，一开始为隐藏状态，切换为显示状态后，再次切换为隐藏状态的时候报错
v-if / v-show
相同点：都可以实现局部html（或者说是dom元素）的显示和隐藏
不同点：显示和隐藏的原理不同。对于v-show指令而言，当为false时不显示控制的dom元素，其实就是display = none，只是将控制的dom元素给隐藏了，打开控制台调试工具，仍然能够看到被隐藏的代码。但是，对于 v-if指令而言，当为false时不显示被控制的dom元素是因为被控制的dom元素被从dom中移除了，也就是说，打开调试工具后，你看不到被隐藏的代码。
是因为在html中使用了v-if来控制局部显隐导致的 将v-if 改成 v-show就解决问题啦
在v-if为false时，如果我们后续的js操作了v-if控制的dom元素，将会因为该部分dom元素不存在而抛出上述异常。
DOMException: Failed to execute 'insertBefore' on 'Node 问...
v-show和v-if v-show跟v-if都是做条件隐藏跟显示用的， v-show是根据样式进行显示隐藏dis...
v-show通过CSS的display控制显示和隐藏 v-if组件是真正的渲染和销毁，而不是显示和隐藏 频繁切换显...
v-show/v-if 控制元素显示或隐藏 v-show 是用display：none；来控制元素显示或隐藏的 ...
v-text:绑定内容 v-html:渲染html v-show:切换显示隐藏 v-if:条件渲染 v-else:...
1 .v-show和v-if的区别 v-show 通过css display 控制显示和隐藏 v-if 组件真正的...
v-show/v-if控制元素显示或隐藏 v-show 是用display：none；来控制元素显示或隐藏的 v-...
一、v-show和v-if：v-show和v-if都可以控制元素的显示或隐藏，但是v-show是用display控...
v-if和v-show都是控制显示和隐藏的，但是v-show使用过css样式display来控制显示和隐藏，这个标...
1. v-show和v-if都可以控制元素的显示或隐藏 v-show 例： 例：点击显示和隐藏 2.v-bind ...
本文标题：误用v-if / v-show 导致切换隐藏显示的时候报错：
本文链接：https://www.haomeiwen.com/subject/khtgiqtx.html
网友评论