2017-08-24 1 views
-2

だから、私はProjectDatesと呼ばれる子を持っているProjectと呼ばれるコンポーネントを持っています。 ProjectDatesは親の開始日と終了日を受け取り、完了率を計算します。React - render()に多くのロジックを持たせるのは難しいですか?

私は現在render()で計算していますので、componentDidUpdatecomponentDidMountの両方で計算する必要はありません。それは正しいのですか、それとももっと適切なライフサイクルフックが必要ですか?

+0

「論理」とは何を意味するのか分かりませんが、論理をすべて「レンダリング」に入れてはいけません。 – Nocebo

答えて

1

あなたの提案はすべて間違っていると思います。それらを1つずつ取ることができます:

1)コンポーネントwillMount。ここにいくつかのロジックを置くことができますが、ここではサイド依存関係を紹介するのはnot recommendedです。ですから、実際には、通常、バックエンドと対話しなければならないときには、ほとんど役に立ちません。より良い選択 - componentDidMountあなたはそのような制限がありません。

2)componentwillUpdate。あなたはここで注意する必要があります - 無限ループに終わらないように。 setStateここにis prohibitedを呼び出すと、componentWillUpdateと同じように呼び出される可能性があります。 componentWillReceivePropsの使用を検討してください。

3)レンダリング。このメソッドには、コンポーネントのコンテンツを準備する(レンダリングする)以外のロジックは含まれていないはずです。 「ビジネス」ロジックをcomponentWillReceiveProps/componentDidMountに移動するか、該当する場合はコンストラクタに移行することを検討してください。

アーキテクチャに関する決定を下す前に、公式docsに行くことをお勧めします。

+0

申し訳ありませんが、私はそれが貧弱な言葉かもしれないと思います。それは今より意味があるのですか?これはドキュメントではカバーされていないようです。 – MitchEff

+0

これで、より適切なメソッドが表示されます。実際には 'レンダリング'に '論理'が存在しないことを除いて。あなたが 'componentDidUpdate'と' componentDidMount'でコードの重複を心配しているならば、別のクラスメソッドでロジックを移動し、両方の場所でそれを呼び出すだけです。 – Amid

関連する問題