React JS中的虚拟DOM和真实DOM的区别?

时间:2018-09-26 08:29:07

标签: reactjs

有人可以解释React JS中的虚拟DOM和真实DOM之间的区别吗?我得到以下答案,但对我来说仍然不清楚。任何帮助将不胜感激。

  

虚拟DOM是轻量级的JavaScript对象,其最初只是真实DOM的副本。它是一个节点树,列出了元素,它们的属性和内容作为对象及其属性。 React的render函数从React组件中创建一个节点树。然后,它会响应由用户或系统执行的各种操作引起的数据模型中的突变来更新此树。

1 个答案:

答案 0 :(得分:0)

如果您举一个内部装有镜子的电梯示例,虚拟DOM非常容易理解。假设有4个人进入电梯。现在,镜子将由4个人反映其外观。再次进入电梯的人将反射镜子的对象。当人们从电梯离开时,镜对象也会发生变化(增加,减少甚至是空的),也会产生相同的效果。因此,在现实中,镜子没有真实的对象,而只是反映了它与外部对象的存在。

虚拟DOM在概念上相似。它没有真正的DOM。它只是包装在JavaScript对象中的真实DOM的副本。每当DOM更改时,虚拟DOM也会更改。

出于您的兴趣,您可能会看到以下信息:

Rendered element in react