2017-11-30 18 views
0

還元状態をクリアすることについて質問があります。 フェッチするアドレスを検索するための名前はsearchです。これは、この還元状態をクリアする最良の方法

search:{ 
    status: 'INIT', 
    results: [], 
} 

statusのような構造の「SUCCESS」または「FAILURE」のような非同期リクエストの何かのためのフラグです。

resultsは、フェッチの結果です。

ユーザが検索ワードを使用してアドレスを検索すると、検索結果にフェッチ結果があります。 そして、私のコンポーネントは、ユーザーが、他のいくつかの作品の後に再度検索してみてくださいresultsが明確でないため、コンポーネント前の検索結果をレンダリングするとき

<div> 
    {this.props.results.map((result,i)=>{ 
    <div>{result}</div> 
    )} 
</div> 

は、だから私の問題があり、次のようにレンダリングします。

現在、結果を使用した作品が完了した後、search状態を初期化するアクション 'CLEAR_SEARCH'を送信します。しかし、私はそれが良い方法ではないと思う。

良いアイデアはありますか?

答えて

2

あなたが新しい要求を初期化起動すると、あなたはこのようにそれを扱う

dispatch(startLoadingAction()) 
try { 
    const result = await fetch... 
    dispatch(successAction(result)); 
} catch { 
    dispatch(failureAction()); 
} 

をSTART_LOADINGアクション呼び出しをディスパッチすることができます

case START_LOADING: 
    state = { 
     status: 'LOADING', 
     result: [], 
    }; 
    break; 
0

還元型のリクエストを持っているのは普通のパターンです { isLoading: false, data: [], error: false, isLoaded: true, hasFailed: false, }検索結果をクリアまたは再発行すると、リクエストのステータスが変更され、プレゼンスだけでなくリクエストに基づいて表示することができますのデータ。

関連する問題