0

シナリオ:フラックス ストア (非同期ロード) に状態がある反応アプリがあり、データをその子に渡すルート コンポーネントにデータを渡します。

現在: ノード ツリーのどこか深くにネストされているテキスト入力フィールドの初期値は、prop から getInitialState で実行され (prop は渡されています)、onChange イベントでその状態は型指定された値に設定されます。これまでの本の例。フォームを「送信」しましょう。アクションがトリガーされ、ajax 呼び出しが行われ、データが変更されて戻ってきて、ルート コンポーネントにイベントを発行するストアに渡され、ノード ツリーが再度レンダリングされますが、もちろん getInitialState はトリガーされません。フィールドには最後に入力された値が残っています。キーストロークごとに action-store-root-children-reRender ループ全体を開始したいとは思いませんよね?

質問:渡されたプロップ (ストアのもの) から入力の状態を新鮮にするにはどうすればよいですか?

考え:うーん、ROOT の componentWillUpdate() でストアの「フラグ」を設定してから componentDidUpdate() で設定し直すことで、ROOT から再レンダリングを開始するタイミングを実際に知ることができます。再レンダリングする ROOT インテントであるか、ストア以外で開始された単なる親の変更です。

4

2 に答える 2

0

代わりにフォームの値をストアに保持し、ローカル コンポーネントstateをまったく使用しないでください。フォームが編集されると、アクションがトリガーされてストアが更新され、アプリが再レンダリングされます。

于 2015-08-06T10:58:34.310 に答える
0

First of all what you are doing is an antipattern. State should not be set equal to props. Your props should not be state.

The React docs are pretty clear on updating props. Check out this link: https://facebook.github.io/react/docs/component-specs.html

componentWillReceiveProps(object nextProps)

You should think about implementing this lifecyclemethod it will help you to be aware of prop changes.

But please think about seperating props and state - there is a reason why React Framework has both. But that is a different topic.

EDIT1: If you want to update your stores state then call a flux action that referes to the corresponding store and pass in the props as payload inside of the lifecyclemethod above.

Hope this helped.

于 2015-08-06T09:22:28.130 に答える