亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

ReactJS - 在調用“setState”的任何時候都會調用render嗎?

ReactJS - 在調用“setState”的任何時候都會調用render嗎?

慕蓋茨4494581 2019-07-29 10:22:38
ReactJS - 在調用“setState”的任何時候都會調用render嗎?React是否每次都會重新渲染所有組件和子組件setState?如果是這樣,為什么?我認為這個想法是React只在需要的時候渲染 - 當狀態改變時。在下面的簡單示例中,兩個類在單擊文本時再次呈現,盡管狀態在后續單擊時不會更改,因為onClick處理程序始終將其state設置為相同的值:this.setState({'test':'me'});我希望渲染只會在state數據發生變化時發生。以下是該示例的代碼,作為JS Fiddle和嵌入式代碼段:var TimeInChild = React.createClass({     render: function() {         var t = new Date().getTime();         return (             <p>Time in child:{t}</p>         );     }});var Main = React.createClass({     onTest: function() {         this.setState({'test':'me'});     },     render: function() {         var currentTime = new Date().getTime();         return (             <div onClick={this.onTest}>             <p>Time in main:{currentTime}</p>             <p>Click me to update time</p>             <TimeInChild/>             </div>         );     }});ReactDOM.render(<Main/>, document.body);<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.0.0/react.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.0.0/react-dom.min.js"></script>[1]: http://jsfiddle.net/fp2tncmb/2/
查看完整描述

3 回答

?
拉風的咖菲貓

TA貢獻1995條經驗 獲得超2個贊

不,當狀態發生變化時,React不會渲染所有內容。

  • 每當組件變臟(其狀態發生變化)時,該組件及其子組件將被重新呈現。在某種程度上,這是盡可能少地重新渲染。沒有調用render的唯一時間是將某個分支移動到另一個根,理論上我們不需要重新渲染任何東西。在您的示例中,TimeInChild是子組件Main,因此在Main更改狀態時也會重新呈現。

  • React不會比較狀態數據。當setState被調用時,它標志著成分為臟(這意味著它需要被重新呈現)。需要注意的重要一點是,盡管render調用了組件的方法,但只有當輸出與當前DOM樹(也就是虛擬DOM樹和文檔的DOM樹之間的差異)不同時,才會更新真正的DOM。在您的示例中,即使state數據沒有更改,上次更改的時間也會發生,使Virtual DOM與文檔的DOM不同,因此更新了HTML的原因。


查看完整回答
反對 回復 2019-07-29
  • 3 回答
  • 0 關注
  • 1968 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號