react元素的不可变性

React 元素是不可变对象。一旦被创建,你就无法更改它的子元素或者属性。一个元素就像电影的单帧:它代表了某个特定时刻的 UI。

根据我们已有的知识,更新 UI 唯一的方式是创建一个全新的元素,并将其传入ReactDOM.render()

考虑一个计时器的例子:




  
  
  
  Document
  
  
  
  
   


  

这个例子会在 setInterval() 回调函数,每秒都调用 ReactDOM.render()

注意:browser.min.js包必须导入,因为浏览器不支持jsx写法,需要使用babel转译

React DOM 会将元素和它的子元素与它们之前的状态进行比较,并只会进行必要的更新来使 DOM 达到预期的状态。

尽管每一秒我们都会新建一个描述整个 UI 树的元素,React DOM 只会更新实际改变了的内容,也就是例子中的文本节点。

你可能感兴趣的:(react.js)