React.js react-routerの使い方

React.js react-routerの使い方

Reactで画面遷移を実現するためのルーティング機能react-routerの導入と簡単な使い方

環境

  • OS  CentOS Linux release 8.0.1905 (Core)
  • node V10.16.3
  • npm 6.9.0
  • React 16.12.0

Reactプロジェクト作成

react-router-testという名前でプロジェクトを作成してます。

react-routerインストール

下記のコマンドでインストールします

react-router使い方

src配下のApp.jsを下記のコードに編集します。

ブラウザから http://プライベートIP:3000/aboutにアクセスするとaboutページにアクセスすることができるようになります。