2016-07-01 12 views
18

タイマーやWebAudio APIなどの設定が必要なReactコンポーネントがある場合は、初期化をconstructorまたはcomponentWillMountにするかどうかを決定するのに問題があります。いずれかのメリットとデメリットはありますか?どちらがより良い場所であるかはわかりません。どのような初期化はコンストラクタ対componentWillMountでより適切ですか?

誰もがconstructorcomponentWillMountの違いについて話し合っていたのを見てみましたが、何も見つかりませんでした。

EDIT:Reduxと任意の非同期関数は、方程式の一部であってはなりません。

+0

ドキュメンテーションによると、これは 'componentDidMount'になければなりません:https://facebook.github.io/react/docs/component-specs.html#mounting-componentdidmount"タイマーを設定したい場合。 .. or setInterval ...これらの操作をこのメソッドで実行します。 " – lux

答えて

17

の状態を初期化することができ

あなたは、コンストラクタで行う唯一のものは、あなたのコンポーネントがステートフルであれば、あなたの最初のthis.stateを割り当てることです。コンストラクターでは何もしないでください。

componentWillMountは一般に不要です。私はほとんどの場合、その使用は反パターンであると言います。人々がそれを使う1つの理由は、レンダリングの前に外部ソースから状態を更新することですが、それを技術的にコンストラクタに割り当てることは同等です。それが与える唯一のマイナーな利便性は、内部にsetStateを入れることができますが、コンストラクタ内に入れることはできません。

副作用(データの取得またはDOM操作)については、componentDidMountを使用する必要があります。

+0

高次コンポーネントをビルドしているようですが、私は 'componentWillMount'で設定する必要があります。テストのように、私は 'WillMount'を' DidMount'に改名しました.HOCの状態から渡されていない小道具についてはラップされたコンポーネントにエラーがあります。多分、HOCは 'componentWillMount'が初期化するのに適した場所であり、コード実行の束に基づいて状態を設定しなければならない特殊なケースでしょうか? (具体的には[this code](https://github.com/ffxsam/formous/blob/master/src/index.js#L35-L62)を参照してください) – ffxsam

+1

HOCを構築するかどうかには違いはありません。 HOCは単なるコンポーネントを返す関数です。このコンポーネントは他のコンポーネントと変わらないので、同じ規則が適用されます。あなたのコードでは、初期状態を計算するロジックをコンストラクタに移したいと思っています。 'setState'を呼び出すのではなく、' this.state'に代入します。 –

+0

ああ、コンストラクタはすべてのセットアップコードの適切な場所です。私は確信が持てませんでした。私はそれが 'constructor'か' componentDidMount'に属しているかどうかを往復し続けました。 :)それで、なぜDOM操作がコンストラクタではうまくいかないのですか?しかし、データフェッチの何が問題なのですか? – ffxsam

1

フラックスアクション(ajax呼び出しの場合)を呼び出すには、componentWillMountまたはcomponentDidMountを使用します。あなたは、コンストラクタ通常

関連する問題