サーバー側から既に利用可能な場合、componentDidMountがデータを取得しないようにする

Question

コンポーネントがマウントされると（サーバー側のレンダリング後に水分補給されるときを含む）ComponentDidMount（）がトリガーされます。

私がオンラインで見つけた解決策の1つは、状態にデータがあるかどうかを確認することです。しかし、これはすべてのコンポーネントに多くのコードを含める必要があります。他の解決策は何ですか？

componentDidMount() { 
    // if rendered initially, we already have data from the server 
    // but when navigated to in the client, we need to fetch 
    if (!this.state.data) { 
     this.constructor.fetchData(this.props.match).then(data => { 
     this.setState({ data }) 
     }) 
    } 
    } 

Answer 1

私は代わりの解決法を見つけました。 Reduxストアでは、現在のページのURLを保持します。したがって、ナビゲーションでは、私は以下を行うことができます：

componentDidMount() { 
    const { url, match } = this.props; 
    if (url !== match.url) { 
    fetchData(match.path); 
    } 
}