コンポーネント間の通信を反応

、小道具を通過

  • 親コンポーネントに共通データ、独自の内部構成要素に固有のデータ(状態)
  • 小道具は、一層のみが送信され、一般的なデータおよび機能データを介して、すなわち送信一方向性単層を通過することができます
  • 一般的なデータ

          親コンポーネントサブアセンブリは、データを渡すために - データが読み込ま>サブアセンブリ

  • ファンクションデータ

         サブアセンブリの構成部品は、親にデータを渡す - >子要素は、関数を呼び出します

要約:

コンポーネント間の通信息子、小道具プロパティの使用。前記サブアセンブリ(一方向)への親要素からのみを転送すること。サブアセンブリは、コールバック関数によってアセンブリに親データを転送する場合。

兄弟コンポーネントが直接通信できない、通信のみ共有間接親コンポーネントを介して行うことができます。

通信に使用される小道具は、部品の多くのレベルに適用可能なデータ転送が非常に複雑な状況ではない、ではありません。

第二に、メッセージのサブスクリプション(購読) - リリース(公開)のメカニズム

データ(世代)側の放出を(発行)発行、受信したデータメッセージ(購読)の供給側では、メッセージのためのものです。

我々は階層を越えて通信することができますこの方法。任意の2つの構成要素の通信が可能になるように。

放出機構 - JavaScriptでは、サードパーティのライブラリPubSubJS完全なメッセージのサブスクリプションを使用します。

ドキュメント:https://github.com/mroderick/PubSubJS

PubSubJSは使用します。

1.インストール

NPMのpubsub-jsから--saveをインストール

2.

// 導入 
'のpubsub-JS'からの輸入のPubSub

 

// 订阅
PubSub.subscribe( '削除'、関数(MSG、データ){});

 

//が発表された 
( '削除'、データ)PubSub.publishを

主なAPI

PubSub.subscribe(トピック、コールバック)

ニュースを購読

パラメータ:

トピック

メッセージ名

折り返し電話

メッセージを受信したコールバックハンドラは、2つのパラメータを受け取ります。

MSG

メッセージ名

データ

データ・パブリッシャは、発行されました

返却値

トークンを返し、それを解除するために使用することができます

 

PubSub.publish(トピック、データ)

ニュースリリース

パラメータ:

トピック

そうでない場合は、メッセージを受信しない、などのメッセージ名、メッセージ名のニュースパブリッシャとサブスクライバを定義する必要があります

データ

データ・パブリッシャは、発行されました

 

PubSub.unsubscribe(トークン)

サブスクリプションをキャンセルするメッセージ

パラメータ:

トークン

の値を返します)(サブスクライブ

三、再来

これはあまりにも多く、有名なReduxの、ライブラリの管理に特化した独立した状態を導入しないでしょう。大規模かつ複雑なプロジェクトの組み合わせを完了するように反応します。

おすすめ

転載: www.cnblogs.com/qinney1109/p/11202085.html