でルーティングしようとするときに使われてるデファクトっぽい

分かりやすくないので、正直あまり好きではない

htmlファイル一個作ってaタグ書くだけだったはずの作業がなんでこんなことに

とか、コンポーネントで考えない方がいいんじゃないか

と組み合わせたりすると、もう頭の中がぐっちゃぐちゃ

なんか特殊なhistoryオブジェクトをごにょごにょしてくれるらしい

routingごとに表示したい内容をRouteで定義して

propと比較され、マッチした場合に当該

マッチしなかったやつはnullがrenderされる

で囲った場合、その中の最初にマッチしたやつだけがrenderされる

<Switch>
  <Route exact path="/" component={Home} />
  <Route path="/about" component={About} />
  <Route path="/contact" component={Contact} />
  {/* when none of the above match, <NoMatch> will be rendered */}
  <Route component={NoMatch} />
</Switch>