vue 热更新的时候，使用 document 获取到的 dom 元素里面包含的内容会消失，但是 ref 获取到的不会消失，这是为什么？为什么在 vue 中获取 dom 使用 ref，而不适用 document，有什么区别吗？

• 資深大佬 : tanranran

  ref 到的 DOM，应该是内存里面的虚拟 DOM
  document 则是实打实的 DOM，渲染的时候被替换成 <!—-> 了

• 資深大佬 : ragnaroks

  @ragnaroks 也就是说在没有渲染完毕之前，真实的 dom 里面的内容全是<!—->，所以我获取到的 dom 里面的内容是空的？

• 主 資深大佬 : Pokemon123

  setTimeout 解决一切疑难杂症

• 資深大佬 : xiangyuecn

  @xiangyuecn 可以再说的详细一些吗☺？

• 主 資深大佬 : Pokemon123

  你看下 vue 的 nexttick 就了解了,有提到 dom
• 資深大佬 : ragnaroks

  @ragnaroks 好的，谢谢❀

• 主 資深大佬 : Pokemon123

  可别听上的 setTimeout，是有多大的❤️才会用这个蠢办法

• 資深大佬 : hongch

  ref 里存的应该是 vue 自己的一个对象，有自己的唯一 key 值与实体 dom 做对应，在 vue 更新节点后更新两者之间的联系。setTimeout 的方法是，利用 marco queue 运行比 .nextTick 和 promise 优先级慢的特点，企图在 vue 更新 dom 节点后在去用 document 获取，不是拿不到，html 上的节点怎么可能拿不到。就是不太符合 vue 的思想

• 資深大佬 : azcvcza

  在 vue 管理下的 dom 节点是会更新的，
  比如你用 var nodeNoRef = document.querySelecotr(‘.xx-node’) 拿到一个节点，
  vue 触发热更新(或者是 update)之后，上面的 nodeNoRef 就可能已经不在 document 中了，只是一个即将被回收的对象。
  解决方法：
  1. 每次使用 DOM 都用 Vue 的$ref 获取 ;
  2. 在必要时使用$nextTick 。 常见场景：data 更新后，需要立即获取 DOM，可能需要在$nextTick 中来获取 DOM 。

• 資深大佬 : meepo3927

  @meepo3927 那我使用$ref 获取 dom 的时候，此时页面上还没有渲染真正的 dom 对吗？