私はこの質問のさまざまなバリエーションを参照していますが、私の状況では実際には何も私をクリックしていません。私はReactにかなり新しいです。そして、私は "React Way"またはベストプラクティスと見なされるものを見たいと思っていました。Reactを使用して親コンポーネントを正しく更新する方法
高レベルの観点からは、入力用のモーダルをトリガーするボタンを備え、機能を使用して新しいユーザーを追加できる「ユーザー」テーブルがあります。ここで
は、コンポーネントの私の現在のツリーです:
.
└── UserLayout
├── AddNewUserButton
└── UserModal
└── UserGrid
└── UserGridBody
└── UserGridRow
UserLayout
は国家としての私のユーザーの初期GET
を行い、コンポーネントはprops
として渡される私の子供を更新するコンポーネントです。
UserModal
は入力を処理し、POST
をAPIに処理します。
私の質問は、私のUserModal
コンポーネントのPOST
の後にユーザーテーブルの更新をどうすればいいですか。状態を再設定する子コンポーネントにコールバック関数を渡す例を見てきましたが、この状況では2つのレベルのコンポーネントを介して行う必要があり、おそらく私の状態駆動コンポーネントを不適切に考えていると思います私は試したことが真実であることについていくつかアドバイスを受けたいと思っていました。ベストプラクティスとは何ですか?
すべてのコードを投稿するともっと役立つかどうかを教えてください。私はこのタイプの質問には必要ではないと思っていましたが、それが私の問題をよりよく説明するのに役立つなら、確かにそれを行うことができます。
はい、これを実行する唯一の実行可能な "バニラリアクションウェイ"コンポーネントを小道具を介して下に通す。一度に1つのコンポーネント。これは1つ、おそらく2つのレベルのためにうまく動作します。しかし、アプリが複雑な場合や、このシナリオが非常に一般的な場合は、[redux](http://redux.js.org/)や[MobX](https:// mobx.js.org/)。このようなライブラリがさらにありますが、この2つが最も一般的です。彼らはどちらも長所と短所があり、あなたが決定する前にそれぞれについていくつかの調査をしたいと思うかもしれません。 SOの[tag:redux]と[tag:mobx]もチェックアウトすることができます。がんばろう! – Chris
Chrisが言ったように、Flux、Redux、またはMobXを使って、深いデータが流れているようなシナリオを試すことができます。 –
@Chris - 私の考えで確認していただきありがとうございます。私は2つの層がひどいとは思わないが、間違いなく私の状態を適切に維持することをより誠実にしている。あなたのための最後の質問...最新のユーザーを州のユーザーの配列にプッシュするのが最善でしょうか?または、すべてのユーザーを再び戻して、そのように状態をリセットする必要がありますか? – scapegoat17