2017-02-07 22 views
-1

これは非常に奇妙な問題で、他の誰かがそれを経験したかどうかを知りたがっています。反応成分 "時々"はプロップを見つけません

時々、私の反応コンポーネントは小道具のプロパティを見つけられません。時々、ページが完璧にレンダリングされるので、私は時々言います。他の時には、それは小道具を見つけることができません。もし私がそれを2度ほどリフレッシュすると、それは働き始めます。

バンドルされた小型化されたJSファイルで問題が発生する可能性があると思ったので、WebPack Devサーバーがその場で機能するファイルに切り替えました。

断続的な原因で何が起こっているのか分かりにくいです。なぜそれが1つのケースで失敗したら、ページが数回リフレッシュされたら、それは機能し始めますか?

私はこれが重要であるとは思わないが、私は以下のようにオブジェクトのプロパティにアクセスしています:

<MyComponent name={this.props.account.accountHolder.firstName} /> 

私はエラーを取得するとき、私はそれをデバッグする場合、私はfirstNameのがundefinedであることがわかります。ページを数回更新するとすべて正常に動作します。

これを引き起こす原因は何ですか?

+0

どのようにデータが入力されていますか? API呼び出しからですか?静的ファイルですか? – finalfreq

+0

データはどこから来ていますか?データはAjax経由でロードされますが、レンダリングする前にデータが到着するまでコンポーネントが待機しませんか? –

+0

オブジェクトはAPI呼び出しの後に移入され、Reduxストアに入ります。 – Sam

答えて

1

あなたは競合状態と戦っているようです。

ケース1(すべてがうまくいく):

  1. アプリがロードされているあなたのAJAXリクエストが送信され
  2. あなたのAjaxリクエストが返され、データは、あなたのアプリがレンダリングReduxの
  3. に挿入され、この方法は、
  4. 利益

カスと呼ばれていますE 2:

  1. アプリがロードされている
  2. あなたのAJAXリクエストは
  3. あなたのアプリはメソッドが
  4. Kaputと呼ばれているレンダリング送られます!
  5. あなたのAJAXリクエストが返され、データはReduxの

に挿入されているので、あなたのコンポーネントに、解決策は、あなたの減速の状態に多少依存し、あなたの期待される動作は何ですが、私はお勧めしているいくつかの検証を行います正しい小道具が実際にポピュレートされ、子コンポーネントを表示できるようになるまで、何か他のもの(null、スピナー、エラーメッセージ、w/e)を表示しない場合、データは実際に存在します。

関連する問題