在ReactJS組件中，當用戶修改單元格值時，是否在實際DOM或虛擬DOM中修改它？

Question

我在學習ReactJS框架。我不清楚下面的方面。 當用戶在表單單元格中輸入某個值時，是否在實際的DOM中進行修改？或者只是首先在虛擬DOM中直接更新？

謝謝。

Answer 1

既不，React具有單向綁定，這意味着當您更改狀態（使用this.setState({...})）時，render()被再次調用。這會更新虛擬DOM，然後更新實際的DOM。

如果用戶輸入的輸入，什麼都不會發生，除非你設置什麼來改變用戶輸入的狀態（例如，添加onChange()）。然後onChange函數將需要用新值更新狀態。

Answer 2

當你進入形式上細胞的值，並且沒有該輸入字段沒有輸入處理程序。當您在單元格中輸入值時，實際的DOM會得到修改，並且該值將保留在表單元中。

但我們通常不會這樣做，相反我們將在組件中擁有一個onChange處理程序，該處理程序將採用新值並使用render方法回送輸入單元格。渲染被調用後，虛擬DOM首先被更新，然後作出反應，以確定真正的DOM是否需要更新。