0

私の状況は次のとおりです。

次のタイプのオブジェクトにすぎない、還元状態に 1 つのフィールドがあります{String, [{String, Float}]}。私の状態のこのフィールドは、2 つのコンポーネント (を変数として使用して GraphQL をクエリする) によって使用されますString。

両方のコンポーネントは、connect(デコレータ構文を使用して) メソッドを介して接続されます。

@connect((state) => ({variable: state.variable.field}))
@graphql(QUERY, {...})
export default class Component1 extends React.Component { ... }


@connect((state) => ({variable: state.variable.field}))
@graphql(QUERY, {...})
export default class Component2 extends React.Component { ... }

これは他のすべてで機能するため、特別なことは何もありませんComponent。それでも、renderメソッドで状態をログに記録しながら、同じレベルでこれらのコンポーネントを呼び出すと、次のようになります。

<div>
    <Component1 />
    <Component2 />
</div>

Component1状態をそのままログにComponent2記録し、初期状態をログに記録します。コンポーネントを所定の位置に切り替えると、次のようになります。

<div>
    <Component2 />
    <Component1 />
</div>

逆のことが起こります:Component2正しい状態を記録しますが、記録Component1しません。

コンポーネントのいずれかを相互にComponent1呼び出すと (Component2レンダリングの一部として呼び出す場合)、すべて問題ありません。

ここで何が起こっているのかわかりません。また、同じ場所で同じ状態をリッスンしている 2 つのコンポーネントを呼び出すべきではないというドキュメントも見つかりません。

誰かが何が起こっているのかを理解するのを手伝ってくれることを願っています

4

1 に答える 1

0

通常、これは問題になりません。おそらく問題はあなたのコードが原因ですか？(実際のコードを見ていない単なる大げさな推測です!)

しかしconnect、とにかく to Redux を親コンポーネントに持ち上げることをお勧めします。特に、両方のコンポーネントが状態のまったく同じ部分を必要とする場合。

于 2016-10-19T07:44:02.383 に答える