一.虚拟DOM
React 原理
1. 存放 state 数据
2. JSX 模版
3. 数据 + 模版 结合， 生成真实的DOM， 来显示
eg: <div id=‘abc‘><span>hello word</span></div>
4. 生成虚拟DOM(虚拟DOM就是一个JS 对象， 用来描述真实DOM)
eg: [‘div‘, {id:‘abc‘}, [‘span‘, {}, ‘hello world‘]]
5. state 发生变化
eg: <div id=‘abc‘><span>bye bye</span></div>
6. 数据 + 模版 结合生成 虚拟DOM(虚拟DOM就是一个JS 对象， 用来描述真实DOM)
eg: [‘div‘, {id:‘abc‘}, [‘span‘, {}, ‘bye bye‘]]
7. 比较原始虚拟DOM 和 新的虚拟DOM 的区别， 找到区别的span内容
8. 直接操作DOM, 改变 span 中的内容
二. 深入了解虚拟DOM
原文：https://www.cnblogs.com/zonehoo/p/11637297.html