2017-11-03 12 views
1

loading = true(networkStatus = 1)でクエリが停止する可能性のある理由は何ですか?<query>ロードはtrueに変更されません

私は再フェッチにクエリ結果を得ることができない。これは、無限ループのための非常に危険に見える「called2」

graphql(_stepQuery, { 
    name: 'stepQuery', 
    options: ({goalDocId}) => ({ 
     fetchPolicy: 'network-only', 
     notifyOnNetworkStatusChange: true, 
     variables: { 
     goalDocId 
     } 
    }) 
    } 
) 

componentWillReceiveProps(nextProps) { 
    let stepIdsFromServer 
    if (nextProps.currentGoalSteps.length > this.props.currentGoalSteps.length) { 
     console.log('called') 
     this.props.stepQuery.refetch() 
     console.log('this.props', this.props) 
     console.log('nextProps',nextProps) 
     if (!nextProps.stepQuery.loading) { 
     // console.log('nextProps.stepQuery.allSteps', nextProps.stepQuery.allSteps) 
      console.log('called2') 
} 

答えて

1

をログに記録することはできません。

最初にrefetch関数はPromiseであるため、再フェッチの呼び出し直後に正しいクエリ状態を知ることはできません。 .then機能で続行する必要があります。 refetch Apiを参照してください。

最後に、クエリはgraphqlラッパーコンポーネント内で実行されます。したがって、クエリが再度実行されると、コンポーネント全体が再びインスタンス化され、リセットされた状態などでcomponentWillReceiveProps関数に入るため、ローディング状態を確認してcomponentWillReceiveProps関数で再フェッチするべきではありません。

何らかの検索が必要な場合は、回避策としてwithApolloラッパーを使用し、componentWillReceivePropsではthis.props.client( "MUTATION")を呼び出すことで、全体をレンダリングしないので、成分。

関連する問題