React.js stepper

Question

こんにちは私は基本的にステッカーであり、アプリケーションにどこにいるのかをユーザーに知らせるフッタを作成しようとしています。私はルート

に応じて背景色を変更するには画像をラップし、私は他のビューに私のフッターコンポーネントを追加するのdivをしたいと思い

export default class Footer extends Component { 

    render() { 
    return (
     <MuiThemeProvider> 
     <div className="row"> 
      <div className="footer"> 
      <div className="container-fluid" style={containerStyle}> 
       <div className="col-sm-12"> 
       <div className="steps" style={stepStyle}><img src={trailerGray} href="" width="60px" height="60px" style={{margin:25}} alt=""/></div> 
       <div className="steps" style={stepStyle}><img src={clockIcon} href="" width="60px" height="60px" style={{margin:25}} alt=""/></div> 
       <div className="steps" style={stepStyle}><img src={shieldGrey} href="" width="60px" height="60px" style={{margin:25}} alt=""/></div> 
       <div className="steps" style={stepStyle}><img src={detailsGrey} href="" width="60px" height="60px" style={{margin:25}} alt=""/></div> 
       <div className="steps" style={stepStyle}><img src={detailsGrey} href="" width="60px" height="60px" style={{margin:25}} alt=""/></div> 
       </div> 
      </div> 
      </div> 
     </div> 
    </MuiThemeProvider> 
); 
} 
} 

：

フッター（ステッパー）の成分：

<Footer />

私が反応し、ルータ

使用しています

あなたは私が行くべき道を提案できますか？また、どんな提案も大歓迎です。ありがとう

Answer 1

パスをレデューサーの状態で保存することができます。 ステッカーのステップでパスが適切かどうかに応じて、その状態をフッターに追加し、2番目のスタイルを追加します。