それぞれのindex.js
エントリーファイルを持つ2つのWebpack生成リアクションバンドルを含むHTMLページがあり、それぞれのコンポーネントのRenderDOM.render()
はそれぞれ<div>
になります。関連のない2つのReactアプリケーション間でのデータの受け渡し
<!doctype html>
<html lang="en">
<head>
<link href="stylesheets/styles.css" rel="stylesheet">
</head>
<body>
<div>
<div id="retrieveBtn"
style="border: 1px solid black; padding: 5px; width: 10%">
Recuperar Presupuesto
</div>
<div id="lightbox-portal"
style="display: none; border: 1px solid grey">
<div id="react-retrieve"></div>
</div>
</div>
<section class="tariff">
<div id="react-main" class="tariff__content fadeIn js-animated"></div>
</section>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="/eco/econonrps_vflx/build/static/js/main_bundle.js"></script>
<script src="/eco/retrieve_vflx/build/static/js/retrieve_bundle.js"></script>
</body>
</html>
<div id="uxvida-retrieve"></div>
が表示され、我々はそれにデータを入力した場合、我々は各種データをAJAXの応答を受け取ります。
私たちはこれを試しました:各コンポーネントがレンダリングされ、データを受け取り、id="react-retrieve"
に接続されたコンポーネントからReactDOM.render()
〜id="react-main"
をもう1つ作成します。
それは多くのカップリングを生成し、コンストラクタが再び呼び出され、私はそれを望んでいません。要するに
、どのように私は再びReactDOM.render()
を呼び出すことなく、他のデータは、コンポーネント/アプリケーション反応することを渡すのですか?
私は反応についてはあまりよく分かりませんが、最終的にはジャバスクリプトです。あなたはあなたの「コンポーネント」の一方または両方でグローバルにアクセス可能な「インターフェース」を作れませんか?言い換えれば、他の反応コンポーネントによってグローバルスコープから呼び出すことができる反応コンポーネントの1つにメソッドを宣言することはできませんか? – gforce301
あなたはlocalstorageの使用を検討しましたか? https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage – Maru
ああ、私はlocalStorageをまったく考慮しませんでした!それは私が必要とするものかもしれません。 – Deses