正規のDOM要素はどのように変更可能ですか？反応ドキュメントで

Question

は、彼らが主張する：

ReactElementsはDOM要素と混同してはなりません。 ReactElement は、DOM 要素の、ステートレスで不変の仮想表現です。

これは、正規のDOM要素を変更できることを意味しますか？もしそうなら、どのようにDOM要素を突然変異させるかの例を挙げることができますが、ReactElementに適用された同じコードは突然変異しませんか？

Answer 1

これ以上の研究の結果、これは仮想DOMと関係があると私は考えています。

仮想DOMは、ReactElementsの相違点（ある場合）を見つけるために、すべて「diffing」しています。 ReactElementsが突然変異する可能性がある場合、仮想DOMはdiffする必要はありません。要素はそれ自体が変異し、仮想DOMの現在の状態になります。しかし、仮想DOMはdiffしたいので、既存のReactElementを更新するのではなく、仮想DOMにそのReactElementの新しいバージョンを渡すことがあります。また、最新のバージョン（gitのようなもの）にアップデートすると、仮想DOMは実際のDOMを最新バージョンのものに更新します。

完全な流れはこのようなもの（と思う）

が反応が、何かが変わるすなわち場合（statless ReactElement（S）に変換します、あなたのステートフルReactComponent（すなわち、それが変異することができます）を取りに見えます古いものを更新するのではなく、新しいReactElementを発行します）、仮想DOMの作成に使用されます。 ReactComponentの状態が変わると、対応するReactElementsの新しいバージョンが作成され、仮想DOMに送信されます。仮想DOMは古いバージョンに対してReactElementsの新しいバージョンを実行し、それ自体を更新してから実際のDOMを更新します。

伝統的には、通常のDOM要素と通常のDOMでは、diffは発生しません（したがって、新しい要素と古い要素の2つのバージョンのDOM要素はありません。行く）。したがって、DOM要素の新しいバージョンをdiffする代わりに、既存のDOM要素を更新するだけです。

さらに読書：

React Elements vs React Components vs Component Backing Instances

Answer 2

私はあなたがその声明をあまりにも深く読んでいるかもしれないと思います。 ReactJSの文書は、「これは、私たちがそれを使用する瞬間に定義する瞬間の間に変化しない」と言います。

DOMのオブジェクトIDを変更し、DOMの作成時からDOMの使用の瞬間までに作成されたDOM要素のその他の面を変更した古いバージョンのASP.NETなど、これは他のフレームワークのものだと思います。

しかし、この要素は、jQueryによって通常のHTML要素として実際にDOMにレンダリングされた後も変更できます。 DOMの美しさと欠点は、いったん何かがDOMに配置されると、そのデータの妥当性は信頼できないということです。一日の終わりには、単なる文書です。うまくいけば、それは役に立ちます。

Answer 3

反応成分は、小道具または状態によって改変することができる。状態はコンポーネントの内部にあります。小道具は親コンポーネントから渡されます。 DOM上の突然変異は、小道具や状態の変化を介して行う必要があります。いくつかのjQueryコードはReactで動作しますが、非常にお勧めです。