問題タブ [virtual-dom]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
372 参照

virtual-dom - virtual-hyperscript、hyperscript-helpers、および main-loop を接続する方法

hyperscript 、main-loop、hyperx を使用したサブスタックの例を見ています。

ハイパースクリプト ヘルパーを使用してこの例を再作成し、Elm に似たコードを取得したいと思います。そのモジュールは と の両方hyperscriptをサポートしていると言っているvirtual-hyperscriptので、 を試していvirtual-hyperscriptます。

私のコードは次のようになります。

そして、それは私にエラーを与えます:

何がうまくいかないのですか?何かが正しく配線されていないと思います。

それが役立つ場合は、html と使用している browserify ビルド コマンドを投稿できます。

0 投票する
0 に答える
50 参照

dom - 動的ビューを永続化するには?

私は .NET MVC 4 を使用しています。Pinterest スタイルのソーシャル メディア サイトを持っているとしましょう。ユーザーは、コンテンツ (つまり、画像) をピン留めし、ボード上で画像をドラッグ アンド ドロップしてピンボードのレイアウトを決定できます。

ログアウト/ログイン時にコンテンツが以前とまったく同じように表示されるように、作成したレイアウトを保持するにはどうすればよいですか? 関連する ID、クラス、スタイルなどを持つすべての DOM 要素を保存する必要があります。これらのレイアウトも「自動保存」する必要があります。

私が見つけた最良の答えはこれでした:

クライアントでレンダリングされたRailsビューに加えられた変更を保持するには?

しかし、この男は実際の HTML マークアップを保存しているようです。私はそれが非常に急速に非常に柔軟性がなくなると思います. DOM ツリー自体を永続化するか、ReactJS で VirtualDOM (または実際の DOM のインスタンス) をログに再レンダリングできるデータベースに保存できると仮定して、ビューを設計するために ReactJS ルートを使用する必要があると考えました。 -の。

私は何が欠けていますか?私はこれを高低で検索しましたが、この問題を解決する方法についてはあまり運がありません。どんな助けでも大歓迎です!

0 投票する
1 に答える
842 参照

zurb-foundation - Cycle.js でレンダリングされたすべての dom の後に js コードを実行する

Foundation の Reveal プラグインを使用して、Cycle.js アプリで素敵なモーダルを表示したいと考えています。

Webpack とその構成で何時間も遊んだ後、財団の js を自分の (es6) アプリに適切にインポートする方法を見つけました。

ただ、仮想DOMを扱っているので、Foundationのjsを初期化した時点では実際のhtmlは存在しません。

これが私のコンポーネントのコードです:

私のmain.js:

$(document).foundation()これで、アプリが初期化された後にコンソールで実行すると、期待どおりに動作します。しかし、アプリ コードでは、dom は仮想であり、実際の html はまだ挿入されていないため、何も表示されません。

アプリが完全に初期化され、dom が実際に設定された後、どうすれば js コードを実行できますか?

0 投票する
1 に答える
1217 参照

reactjs - Jquery .html()に相当するReact.jsとは

React.js を使用して HTML コンテンツを DOM 要素に追加しようとしています。jquery を使用して DOM にアクセスするのではなく、React で実行したいと考えています。

var DOMNode = ReactDom.findDOMNode(this.refs.contentEdit); $(DOMNode).html(this.props.html);

純粋に反応してこれを書くにはどうすればよいですか

0 投票する
1 に答える
285 参照

javascript - virtual-dom diff 削除のみではなく、置換/削除

virtual-dom hdiffメソッドの使用。

与えられた:[a,b]そして[b]

結果のdiffパッチは、単純に を削除するのではなく、aその後b削除します。ba

RequireBin の例。

結果:

img要素が削除されたり追加されたりしないように、要素を「整列」させるために何をする必要がありますか?

0 投票する
1 に答える
1001 参照

javascript - ReactJS アプリケーションの追跡

私はAngularJSを使用しており、その構造は、ユーザーがWebサイトを閲覧すると、ビューとルートのみが変更され、ページビューなどはトリガーされません(GTMはルートごとにロードされません)。

そのため、 AngularJS Web サイトを操作するときに、Google アナリティクスでかなりの数の問題に直面しました ( Angularticsでさえあまり有望ではありません)。

今、私はReactJSを読んでおり、 Laravelと一緒に使用したいと思っています。React の仮想 DOM の概念全体が、ユーザーがページにアクセスするたびに Google タグ マネージャー コンテナーが読み込まれない可能性があることを意味するため、実際に後で同様の追跡の問題が発生することだけが懸念されます。

React アプリケーションの追跡で問題に直面している人はいますか?

0 投票する
1 に答える
76 参照

javascript - React Virtual Dom に関係するツリーは 3 つですか、それとも 2 つだけですか?

React 仮想 Dom では、サブツリーの部分を理解しています。または少なくとも理解していると思います。React は、setState が呼び出されたコンポーネントからのみ再レンダリングし、場合によってはこれらのコンポーネントのすべての子を再レンダリングします。つまり、setState メソッドが呼び出されていないコンポーネントや、呼び出されたコンポーネントの子ではないコンポーネントは、再レンダリングから安全です。

私が不明な部分は、React がこれらのノードで調整プロセスを実行するとき、正確には何を比較しているのかということです。この時点で、新しく生成された仮想 DOM ツリーがあると思いますが、これを古い仮想 DOM ツリーと比較してから、それらの変更を実際の DOM に適用しますか、それとも新しく生成された仮想 DOM 間でこの調整プロセスが行われますか? 、そして実際のDOMを直接?

上記の回答によっては、追加の質問があるかもしれません。ありがとう!